<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>路线管理</title>
    <style>
		:root {
			/* 主色调：深蓝与冷灰（传递专业、稳重感） */
			--back_color_1: #0d2b50;  /* 深蓝主背景（如夜空）[4,7](@ref) */
			--back_color_2: #1a3658;  /* 稍浅深蓝，区块背景 */
			--back_color_3: #2a4a7c;  /* 中蓝色，按钮/突出背景 */
			--back_color_4: #3d5a9e;  /* 亮蓝色，次级强调色 */
			--back_color_5: #4a6fc8;  /* 高亮蓝，标题/重要边框[6](@ref) */

			/* Hover 配色：明度提升增强交互反馈 */
			--back_color_h_1: #152f5c; 
			--back_color_h_2: #224272; 
			--back_color_h_3: #355a9a; 
			--back_color_h_4: #4a6dbb; 
			--back_color_h_5: #5b80d8; 

			/* 菜单背景：冷灰白保持干净 */
			--menu_back_color_1: #ffffff;       /* 纯白 */
			--menu_back_color_h_1: #f0f4f8;     /* 浅蓝灰 Hover[5](@ref) */
			--menu_back_color_2: #f8fafc;       /* 冷调浅灰 */
			--menu_back_color_h_2: #e6ecf2;     /* 中蓝灰 Hover */

			/* 操作色：冷色系警示（替代暖红） */
			--danger_back_color_1: #e74c3c;     /* 警示红（保留高识别度）*/
			--danger_back_color_h_1: #c0392b;   /* 深红 Hover */

			/* 空间色：冷调浅灰替代暖米白 */
			--space_color_1: #ffffff;           /* 纯白 */
			--space_color_2: #f0f4f8;           /* 浅蓝灰背景[5](@ref) */
			--space_color_3: #e3e8ee;           /* 中冷灰填充 */
			--space_color_h_2: #dce2e9;         /* 浅灰 Hover */
			--space_color_h_3: #edf1f5;         /* 更浅冷灰 Hover */

			/* 文字色：深灰蓝提升可读性 */
			--text_color_1: #ffffff;            /* 白色标题 */
			--text_color_2: #879199;             /* 浅灰蓝正文 */
			--text_color_3: #39464f;             /* 中灰蓝辅助文字[5](@ref) */

			/* 遮罩与线条：冷调半透明 */
			--mask_color_1: rgba(13, 43, 80, 0.7); /* 深蓝遮罩 */
			--mask_text_color: #ffffff; 
			--mask_color_2: rgba(240, 244, 248, 0.4); 
			--line_color_1: #2a4a7c;            /* 中蓝色分隔线 */
			--line_color_2: #3d5a9e;             /* 亮蓝色细线 */
		}
		* {
			box-sizing: border-box;
		}
        html,body{
			margin: 0;
			padding: 0;
			display:flex;
			height: 100%;
			width:100%;
			flex-direction:column;
        }
		#root,#main_div{
			position: relative;
			display:flex;
			width:100%;
			height:100%;
			margin:0;
			padding:0;
			flex-direction:column;
			z-index:1;
		}		
		#container{
			margin: 0;
			padding: 0;
			display:flex;
			height: 100%;
			width:100%;
			flex-direction:row;
        }		
        #map_div {
			display:flex;
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }
        input {
            width: 100%;
            padding: 8px;
            border: 1px solid var(--line_color_1);
			color:var(--text_color_3);
            border-radius: 4px;
        }
		.filte_checkbox{
			width:20px;
			height:20px;
            border: 1px solid var(--line_color_1);		
		}
		.filte_select{
            width: 100%;
            padding: 8px;
            border: 1px solid var(--line_color_1);
            border-radius: 4px;
			color:var(--text_color_3);
		}
        button {
            background: var(--back_color_3);
            color: white;
            border: none;
            padding: 10px;
            border-radius: 2px;
            cursor: pointer;
            font-weight: bold;
            width: 100%;
        }
        button:hover {
            background: var(--back_color_h_3);
        }
		.filte_button {
			background: var(--back_color_4);
			color:white;
		}
       .filte_button:hover {
            background: var(--back_color_h_1);
        }
		.filte_button.select {
			background: var(--back_color_h_3);
			color:var(--text_color_2);
		}
		.filte_button.select:hover {
			background: var(--back_color_h_3);
			color:grey;
		}
        .click-marker {
            background: url(https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png) no-repeat;
            background-size: 30px 40px;
            width: 40px;
            height: 40px;
            position: absolute;
            transform: translate(-15px, -40px);
            pointer-events: none;
        }
		/* 修改原菜单样式 */
	
        #card{
            padding: 0;
            border-radius: 4px;
            width: 100%;
			overflow:scroll;
        }
		#card::-webkit-scrollbar {
		  display: none; /* Chrome/Safari/Edge */
		}
        .input_div {
			display:flex;
			width:100%;
			flex-direction:column;
            margin:0;
        }
        .filte_input_div {
			position: relative;
			display:flex;
			width:100%;
			flex-direction:column;
            margin:0;
        }
		.filte_checkbox_div{
			display:flex;
			width:100%;
			flex-direction:row;
			gap:10px;
			justify-content:center;
		}
		.input-card{
			width:100%;
			display:flex;
			padding:0;
			flex-direction:column;
			align-items: center;
			justify-content: center;
			gap:0px;
		}
		.search-container {
			position: absolute;
			top: 20px;
			right: 20px;
			z-index: 30;
			width: 400px;
			background: rgba(255, 255, 255, 0.9);
			border-radius: 4px;
			box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
			padding: 10px;
		}
		.lay_div {
			position: absolute;
			background: rgba(255, 255, 255, 0.9);
			z-index: 30;
			border-radius: 4px;
			box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
			padding: 10px;
		}
		.lay_check{
			width: 16px;
			heigth:16px;
			margin:0;
		}
		.search-result-item {
			padding: 8px;
			border-bottom: 1px solid var(--menu_back_color_1);
			cursor: pointer;
		}
		.search-result-item:hover {
			background-color: var(--menu_back_color_h_1);
		}
		.input-card input{
			width:100%;
		}
		#myModal {
			display: none;
			position: fixed; 
			z-index: 1000;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			overflow: auto;
			justify-content: center;  /* 水平居中 */
			align-items: center;      /* 垂直居中 */
			background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
		}
		#modalcontent {
			display: flex;
			width:800px;
			flex-direction: column;  /* 改为垂直堆叠 */
			justify-content: center;  /* 水平居中 */
			align-items: center;      /* 垂直居中 */
			background-color: var(--space_color_2);
			color:var(--text_color_3);
			margin-top:auto;
			margin-bottom:auto;
		}
		.close {
			color: #aaa;
			font-size: 28px;
			font-weight: bold;
			display:flex;
			margin-left:auto;
			margin-right:15px;
		}
		.close:hover,
		.close:focus {
			color: black;
			text-decoration: none;
			cursor: pointer;
		}
		#table_div,#filte_div,#detail_table_div{
			display:none;
			width:100%;
			padding-left:50px;
			padding-right:50px;
			padding-bottom:50px;
			gap:10px;
			flex-direction:column;
			justify-content: center;
			align-items: center;
		}
		#hide_table_div{
			width:100%;
			height:300px;
			display:flex;
			pointer-events: auto;
		}
		#table1_div{
			background:var(--space_color_1);
			width:100%;
			flex:1;
			overflow-y:scroll;
			border-top: 1px solid var(--line_color_2);
		}
		#table1{
			border: none;
			width: 100%;
			border-collapse: collapse;
			font-size:16px; 
			padding:0px;
			flex:1;
			margin-bottom:20px;
		}
		#table1thead th{
			position: sticky;
			top: 0;
			background:var(--space_color_2);
			border-bottom:1px solid var(--line_color_2);
			border-left: 1px solid var(--line_color_2);
			border-right: 1px solid var(--line_color_2);			
			color: var(--text_color_3);
		}
		#table1 td{
			border-bottom: 1px solid var(--line_color_2);
			border-left: 1px solid var(--line_color_2);
			border-right: 1px solid var(--line_color_2);
			border-top: 0;
			padding:0px;
			text-align: center;
			word-wrap: break-word;
			color: var(--text_color_3);
		}
		.tabletr:hover {
			background: var(--space_color_h_2);
		}	
		.row-check,#all_check,.part_check{
			width: 16px;
			height: 16px;
		}
		#line_table_div{
			position: absolute;
			bottom: 0;
			display:flex;
			width:100%;
			;padding:0px;
			flex-direction:column;
			z-index:30;
			pointer-events: none;
		}
	.dropdown{
		position: absolute;
		display:none;
		top: 100%; /* 顶部对齐父容器的底部 */
		left: 0;   /* 左侧对齐父容器的左侧 */
		flex-direction: column;
		border-radius: 5px; /* 边框圆角 */
		border: 1px solid var(--line_color_1); /* 边框颜色和粗细 */
		background-color: white;
		max-height:0;
		width:290px;
		transition: max-height 0.2s ease-out; /* 添加过渡效果 */
		z-index:40;
		overflow:hidden;
	}
	#item_div,.dropdown_item_div{
		flex:1;
		overflow-y: auto;
	}
	.dropdown-item:hover {
		background-color: #efeff4; /* 悬停时的背景色 */
	}
	.dropdown-item {
		padding: 5px;
		cursor: pointer;
	}
	.dropdown.expanded {
		display:flex;
		max-height:300px;
	}
	.seach_div{
		display:flex;
		justify-content: center;
		align-items: center;
		padding:2px 5px;
		color:var(--text_color_1);
		background:var(--back_color_3);
	}	
	.seach_div:hover{
		background: var(--back_color_h_3); /* 悬停时的背景色 */
		cursor: pointer; /* 鼠标悬停时显示手型指针 */
	}
	#search_page{
		display:flex;
		width:100%;
		justify-content: center;
		border-top:1px solid var(--line_color_1);
		background:var(--back_color_3);
	}
	#page_info{
		display:flex;
		width:70px;
		justify-content: center;
		align-items: center;
		padding:2px 5px;
		background:var(--back_color_3);
		color:var(--text_color_1);
	}
	#page_info:hover{
		background:var(--back_color_h_3); /* 悬停时的背景色 */
		cursor: pointer; /* 鼠标悬停时显示手型指针 */
	}
	.road_part_id_td:hover,.respon_department_td:hover,.direction_td:hover,.start_pile_td:hover,.end_pile_td:hover,.road_country_id_td:hover,.road_class_td:hover,.road_name_td:hover,.road_desc_td:hover {
		color: var(--back_color_h_1); /* 悬停时的背景色 */
		cursor: pointer; /* 鼠标悬停时显示手型指针 */
	}
	.checkbox_div{
		display:flex;
		flex-direction:row;
	}
	#sidebar{
		display:flex;
		width:320px;
		height:100%;
		background: var(--back_color_1);			
	}	
	.sidebar_button{
		background:var(--back_color_4);
		color:var(--text_color_1);
		width:100%;
		display:flex;
		justify-content:left;
		margin:0;
		padding:10px 30px;
		font-weight: bold;
		cursor: pointer;
		user-select: none;
	}
	.sidebar_button:hover{
		background:var(--back_color_h_4);
		color:var(--text_color_1);
	}	

	#fly_mode_div{
		display:flex;
		background:white;
		width:100%;
		justify-content:center;
		flex-direction:column;
	}
	#road_info {
		display:flex;
		flex-direction:column;
		width:100%;
		overflow:auto;
		height:400px;
		padding: 0;
		margin:0;
	}
	#road_info::-webkit-scrollbar {
	  display: none;
	}
	#road_info_div {
		display:flex;
		border-radius: 4px;
		flex-direction:column;
		background:var(--space_color_2);
		color:var(--text_color_3);
		width:95%;
		overflow:auto;
		padding: 5px;
		border: 1px solid #ddd;
		margin:5px;
	}
	#road_info_div button{
		background: var(--back_color_3);
		color: white;
		border: none;
		padding: 10px 5px;
		border-radius: 2px;
		cursor: pointer;
		font-weight: bold;
	}
	#road_info_div button:hover{
		background: var(--back_color_h_3);
	}
	#fly_mode_menu{
		background:var(--menu_back_color_2);
		color:var(--text_color_3);
		visibility: hidden;
		display:flex;
		height:0;
		padding:0 15px;
		gap:5px;
		width:100%;
		gap:5px;
		flex-direction:column;
		overflow:auto;
		transition: height 0.2s ease-out;
	}
	#fly_mode_menu::-webkit-scrollbar {
	  display: none; /* Chrome/Safari/Edge */
	}
	#fly_mode_menu.expanded{
		height:400px;
		visibility: visible; 
		transition: height 0.2s ease-out;
	}
	.danger_button{
		background:var(--danger_back_color_1);
	}
	.danger_button:hover{
		background:var(--danger_back_color_h_1)
	}
	#edit_div{
		display:none;
		width:100%;
		margin:0;padding:0;
		flex-direction:column;
		gap:5px;
		padding:10px;
		background:var(--menu_back_color_2);
		color:var(--text_color_3);
	}
	#modal_table_div{
		display:flex;
		width:100%;
		height:100%;
	}
	.input_table_div{
		display:none;
		width:100%;
		padding-left:50px;
		padding-right:50px;
		padding-bottom:50px;
		gap:10px;
		flex-direction:column;
		justify-content: center;
		align-items: center;
	}
	.input_table{
		width:100%;
		border-collapse: collapse;
		background:var(--space_color_2);
		color:var(--text_color_2);
		border:1px solid var(--line_color_1);
	}
	.label_cell{
		width:20%;
		padding: 8px;
		border: 1px solid var(--line_color_1);
		color:var(--text_color_3);
	}
	.input_cell{
		width:30%;
		padding: 8px;
		border: 1px solid var(--line_color_1);
		color:var(--text_color_3);
		flex:1;
	}
	.input_row_div{
		border-collapse: collapse;
		display:flex;
		flex-direction:row;
		width:100%;
	}
	#get_distance_button.select{
		background:var(--back_color_h_2);
		color:var(--text_color_2);
	}
	#get_pile_button.select{
		background:var(--back_color_h_2);
		color:var(--text_color_2);
	}
	.export_cell{
		display:flex;
		flex-direction:row;
		width:30%;
		border-radius: 0;
		padding: 8px;
		border: 1px solid var(--line_color_1);
		color:var(--text_color_3);
		cursor: text;
	}

	.export_checkbox{
		width:20px;
		height:20px;
		border: 1px solid var(--line_color_1);
		margin:0;
	}
	.export_row_div{
		border-collapse: collapse;
		display:flex;
		flex-direction:row;
		width:100%;	
	}
	#get_map_color_menu_div{
		border-collapse: collapse;
		display:flex;
		flex-direction:column;
		width:100%;
	}
	.get_map_row_div{
		border-collapse: collapse;
		display:flex;
		flex-direction:row;
		width:100%;	
	}
	.get_map_menu_input_cell{
		flex:1;
		border-radius: 0;
		padding: 8px;
		border: 1px solid var(--line_color_1);
		color:var(--text_color_3);
		cursor: text;
	}
	.alert_info_div{
		position: absolute;
		display:flex;
		background:none;
		z-index: 35;
		width:100%;
		flex-direction:column;
		justify-content: center;
		align-items: center;
		pointer-events: none;
		top:20px;
		gap:10px;
	}
	.alert_info,.filte_info{
		background: rgba(255, 255, 255, 0.9);
		z-index: 35;
		border-radius: 4px;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
		padding: 10px 15px;
		font-size: 24px;
		color:var(--text_color_3);
	}
	#edit_table_button_div button{
		width:auto;
	}
	#win_modal {
		display:none;
		position: fixed; 
		z-index: 1100;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		overflow: auto;
		justify-content: center;  /* 水平居中 */
		align-items: center;      /* 垂直居中 */
		background-color: rgba(0,0,0,0);
		gap:10px;
	}
	#alert_div,#prompt_div,#confirm_div,#key_setting_div{
		display:none;
		border-radius: 8px;
		min-width: 300px;
		min-height: 150px;
		flex-direction:column;
		justify-content: center;  /* 水平居中 */
		align-items: center;      /* 垂直居中 */
		background-color: var(--space_color_2);
		color:var(--text_color_3);
		border: 1px solid var(--line_color_1);
	}
	.win_main_div{
		display:flex;
		flex:1;
		justify-content: center;
		align-items:center;
		flex-direction:column;
		padding:30px;
		width:100%;
	}	
	.win_text_div{
		display:flex;
		width:100%;
		justify-content: center;  /* 水平居中 */
		align-items: center;      /* 垂直居中 */
		color:var(--text_color_3);
	}
	.win_button_div{
		display:flex;
		width:100%;
		bottom:0;
		justify-content: center;  /* 水平居中 */
		align-items: center;      /* 垂直居中 */		
	}
    </style>
</head>
<body>
	<div id ='root'>
		<div id = 'win_modal'>
			<div id = 'key_setting_div'>
				<div class = 'win_main_div' style = "width:480px;">
					<h3>请设置相关参数</h3>
					<label for= "aip_key_input" style = 'margin-right:auto;' >高德服务API Key</label>
					<input id = 'aip_key_input' style = 'width:100%;'></input>
					<label for= "aip_safe_key_input" style = 'margin-right:auto;' >高德服务安全 Key</label>
					<input id = 'aip_safe_key_input' style = 'width:100%;'></input>
					<label for = 'adcode_input' style = 'margin-right:auto;' >地区代号</label>
					<input id = 'adcode_input' placeholder="例如：110000"></input>
					<label for = 'adcode_lng_input' style = 'margin-right:auto;' >初始经度</label>
					<input type = 'number' id = 'adcode_lng_input'  placeholder="例如：116.397428"></input>
					<label for = 'adcode_lat_input' style = 'margin-right:auto;' >初始纬度</label>
					<input type = 'number' id = 'adcode_lat_input'  placeholder="例如：39.90923"></input>					
				</div>
				<div class = 'win_button_div' >
					<button id = 'key_setting_confirm_button' onclick = 'save_key_and_adcode()'>确定</button>
					<button id = 'key_setting_cance_button' class = 'danger_button' onclick = 'close_key_save_win()'>取消</button>
				</div>
			</div>
			<div id = 'alert_div'>
				<div class = 'win_main_div'>
					<span id = 'alert_text_div' class = 'win_text_div'></span>
				</div>
				<div class = 'win_button_div' >
					<button id = 'alert_confirm_button'>确定</button>
				</div>
			</div>
			<div id = 'prompt_div'>
				<div class = 'win_main_div'>
					<span id = 'prompt_text_div' class = 'win_text_div'></span>
					<input id = 'prompt_input' style = 'width:100%;'></input>
				</div>
				<div class = 'win_button_div' >
					<button id = 'prompt_confirm_button'>确定</button>
					<button id = 'prompt_cance_button' class = 'danger_button'>取消</button>
				</div>
			</div>
			<div id = 'confirm_div'>
				<div class = 'win_main_div'>
					<span id = 'confirm_text_div' class = 'win_text_div'></span>
				</div>
				<div class = 'win_button_div' >
					<button id = 'confirm_confirm_button'>确定</button>
					<button id = 'confirm_cance_button' class = 'danger_button'>取消</button>
				</div>
			</div>
		</div>
		<div id = 'main_div'>
			<div id="myModal" class="modal">
				<div id = 'modalcontent'>
					<span style='width:100%;display:flex;padding:0;margin:0;'>
						<span id = "close_icon" class="close">
							&times;	
						</span>
					</span>
					<div id = 'modal_table_div'>
						<div id = 'table_div' class = 'input_table_div'>
							<h2>编辑路线信息</h2>
							<div id = 'road_info_table' class = 'input_table'>
								<div class ='input_row_div'>
									<div class = 'label_cell'>路线识别码</div>
									<input class = 'input_cell' id = 'road_id_input'  placeholder="例如:R1"></input>			
									<div class = 'label_cell'>路段编号</div>
									<input type ='number' class = 'input_cell' id = 'road_part_id_input'  placeholder="例如:1"></input>
								</div>
								<div class ='input_row_div'>
									<div class = 'label_cell'>行政区划名称</div>
									<input class = 'input_cell' id = 'road_ad_name_input' placeholder="例如:义乌市"></input>
									<div class = 'label_cell'>行政区划代号</div>
									<input class = 'input_cell' id = 'road_ad_code_input' placeholder="例如:330782"></input>
								</div>							
								<div class ='input_row_div'>
									<div class = 'label_cell'>
										路线名称
									</div>
									<input class = 'input_cell' id = 'road_name_input' ></input>
									<div class = 'label_cell'>是否启用</div>
									<select class = 'input_cell' id = 'is_work_input'>
										<option value = '是' selected>是</option>
										<option value = '否'>否</option>
									</select>
								</div>
								<div class ='input_row_div'>
									<div class = 'label_cell'>路线编号</div>
									<input class = 'input_cell' id = 'road_country_id_input' ></input>
									<div class = 'label_cell'>方向</div>								
									<select class = 'input_cell' id = 'direction_input'>
										<option value = '双向' selected>双向</option>
										<option value = '上行'>上行</option>
										<option value = '下行'>下行</option>
									</select>								
								</div>
								<div class ='input_row_div'>
									<div class = 'label_cell'>技术等级</div>
									<select class = 'input_cell' id = 'road_lv_input'>
										<option value = '暂无' selected>暂无</option>
										<option value = '一级'>一级</option>
										<option value = '二级'>二级</option>
										<option value = '三级'>三级</option>
										<option value = '四级'>四级</option>	
									</select>
									<div class = 'label_cell'>行政等级</div>
									<select class = 'input_cell' id = 'road_class_input'>
										<option value ='国道'>国道</option>
										<option value ='省道'>省道</option>
										<option value ='县道' selected>县道</option>	
									</select>								
								</div>							
								<div class ='input_row_div'>
									<div class = 'label_cell'>路段长度</div>
									<input type = 'number' class = 'input_cell' id = 'road_long_input' placeholder="单位:m"></input>
									<div class = 'label_cell'>路面宽度</div>
									<input type = 'number' class = 'input_cell' id = 'road_face_width_input' placeholder="单位:m"></input>
								</div>
								<div class ='input_row_div'>
									<div class = 'label_cell'>路基宽度</div>
									<input type = 'number' class = 'input_cell' id = 'road_base_width_input' placeholder="单位:m"></input>								
									<div class = 'label_cell'>路面面积</div>
									<input type = 'number' class = 'input_cell' id = 'road_face_area_input' placeholder="单位:m²"></input>
								</div>
								<div class ='input_row_div'>
									<div class = 'label_cell'>面层厚度</div>
									<input type = 'number' class = 'input_cell' id = 'road_face_thickness_input' placeholder="单位:m"></input>
									<div class = 'label_cell'>设计时速</div>
									<input type = 'number' class = 'input_cell' id = 'road_speed_input' placeholder="单位:km/h"></input>									
								</div>
								<div class ='input_row_div'>
									<div class = 'label_cell'>车道数量</div>
									<input type = 'number' class = 'input_cell' id = 'road_lane_count_input' ></input>
									<div class = 'label_cell'>路面类型</div>
									<input class = 'input_cell' id = 'road_face_type_input' ></input>									
								</div>
								<div class ='input_row_div'>
									<div class = 'label_cell'>巡查部门</div>
									<input class = 'input_cell' id = 'respon_department_input' ></input>
									<div class = 'label_cell'>保洁部门</div>
									<input class = 'input_cell' id = 'clean_department_input' ></input>										
								</div>
								<div class ='input_row_div'>													
									<div class = 'label_cell'>修理部门</div>
									<input class = 'input_cell' id = 'fix_department_input' ></input>
									<div class = 'label_cell'>养护单位</div>
									<input class = 'input_cell' id = 'road_unit_input' ></input>
								</div>
								<div class ='input_row_div'>
									<div class = 'label_cell'>开始桩号</div>
									<input type ='number' class = 'input_cell' id = 'start_pile_input' placeholder="单位:m"></input>							
									<div class = 'label_cell'>结束桩号</div>
									<input type ='number' class = 'input_cell' id = 'end_pile_input' placeholder="单位:m"></input>							
								</div>
								<div class ='input_row_div'>
									<div class = 'label_cell'>建成时间</div>
									<input type ='number' class = 'input_cell' id = 'road_build_time_input' ></input>
									<div class = 'label_cell'>最近检修时间</div>
									<input type ='number' class = 'input_cell' id = 'road_fix_time_input' ></input>
								</div>							
								<div class ='input_row_div'>
									<div class = 'label_cell'>描述</div>
									<input input = 'input_cell' id = 'road_desc_input' class = 'input_cell' style="flex:1"></input>
								</div>
							</div>
							<div style="display:flex;width:300px;flex-direction:row;justify-content:center;align-items: center;gap:10px;">
									<button id="confirmButton">确定</button>	
									<button id="canceButton" class = 'danger_button'>取消</button>	
							</div>					
						</div>
						<div id = 'filte_div' class = 'input_table_div'>
							<h2>筛选表格</h2>
							<div class = 'input_div'>
								<div id = 'filte_road_id_div' class = 'filte_input_div'>
									<label for="filte_road_id_input">路线识别码：</label>
									<input type="text" id="filte_road_id_input" class = 'filte_input'></input>
								</div>							
								<div id = 'filte_is_work_div' class = 'filte_input_div'>
									<label for="filte_is_work_input">是否启用：</label>
									<select type="text" id="filte_is_work_input" class = 'filte_select' value = '是'>
										<option value="">无</option>	
										<option value="是" selected>是</option>							
										<option value="否">否</option>
									</select>
								</div>
								<div id = 'filte_road_name_div' class = 'filte_input_div'>
									<label for="filte_road_name_input">路线名称：</label>
									<input type="text" id="filte_road_name_input" class = 'filte_input'></input>
								</div>
								<div id = 'filte_road_country_id_div' class = 'filte_input_div'>
									<label for="filte_road_country_id_input">路线编号：</label>
									<input type="text" id="filte_road_country_id_input" class = 'filte_input'></input>
								</div>
								<div id = 'filte_road_unit_div' class = 'filte_input_div'>
									<label for="filte_road_unit_input">养护单位：</label>
									<input type="text" id="filte_road_unit_input" class = 'filte_input'></input>
								</div>								
								<div id = 'filte_road_lv_div' class = 'filte_input_div'>
									<label for="filte_road_lv_input">技术等级：</label>
									<select id="filte_road_lv_input" class = 'filte_select'>
										<option value="" selected>无</option>
										<option value='暂无'>暂无</option>
										<option value='一级'>一级</option>
										<option value="二级">二级</option>
										<option value="三级">三级</option>
										<option value="四级">四级</option>
									</select>									
								</div>
								<div id = 'filte_direction_div' class = 'filte_input_div'>
									<label for="filte_direction_input">方向：</label>
									<select id="filte_direction_input" class = 'filte_select' value="">
										<option value="" selected>无</option>
										<option value = '双向'>双向</option>
										<option value="下行">下行</option>							
										<option value="上行">上行</option>
									</select>
								</div>							
								<div>道路类型:</div>
								<div id = 'filte_road_class_div' class = 'filte_checkbox_div' >
									<div class = 'checkbox_div'>
										<label for="filte_road_class_1" >国道:</label>
										<input type="checkbox" id="filte_road_class_1" class = 'filte_checkbox' data-value = '国道'></input>
									</div>
									<div class = 'checkbox_div'>
										<label for="filte_road_class_2" >省道:</label>
										<input type="checkbox" id="filte_road_class_2" class = 'filte_checkbox' data-value = '省道'></input>
									</div>
									<div class = 'checkbox_div'>
										<label for="filte_road_class_3" >县道:</label>
										<input type="checkbox" id="filte_road_class_3" class = 'filte_checkbox' data-value = '县道'></input>
									</div>
								</div>
								<div id = 'filte_respon_department_div' class = 'filte_input_div'>
									<label for="filte_respon_department_input">巡查部门：</label>
									<input type="text" id="filte_respon_department_input" class = 'filte_input'></input>
								</div>
								<div id = 'filte_clean_department_div' class = 'filte_input_div'>
									<label for="filte_clean_department_input">保洁部门：</label>
									<input type="text" id="filte_clean_department_input" class = 'filte_input'></input>
								</div>
								<div id = 'filte_fix_department_div' class = 'filte_input_div'>
									<label for="filte_fix_department_input">维修部门：</label>
									<input type="text" id="filte_fix_department_input" class = 'filte_input'></input>
								</div>
							</div>
							<div style="display:flex;width:300px;flex-direction:row;justify-content:center;align-items: center;gap:10px;">
									<button id="filte_confirmButton">确定</button>	
									<button id="filte_canceButton" class = 'danger_button'>取消</button>
							</div>					
						</div>
						<div id='detail_table_div' class='input_table_div'>
						  <h2>详细信息</h2>
						  <div class='input_table'>
							<div class='input_row_div'>
							  <div class='label_cell'>路段识别码</div>
							  <div class='input_cell' id='road_part_id_detail_page'></div>
							  <div class='label_cell'>路线识别码</div>
							  <div class='input_cell' id='road_id_detail_page'></div>
							</div>
							<div class='input_row_div'>
							  <div class='label_cell'>是否启用</div>
							  <div class='input_cell' id='is_work_detail_page'></div>
							  <div class='label_cell'>路线名称</div>
							  <div class='input_cell' id='road_name_detail_page'></div>
							</div>
							<div class='input_row_div'>
							  <div class='label_cell'>路线编号</div>
							  <div class='input_cell' id='road_country_id_detail_page'></div>
							  <div class='label_cell'>行政等级</div>
							  <div class='input_cell' id='road_class_detail_page'></div>
							</div>
							<div class ='input_row_div'>
								<div class = 'label_cell'>行政区划名称</div>
								<div class = 'input_cell' id = 'road_ad_name_detail_page'></div>
								<div class = 'label_cell'>行政区划代号</div>
								<div class = 'input_cell' id = 'road_ad_code_detail_page'></div>
							</div>						
							<div class='input_row_div'>
							  <div class='label_cell'>方向</div>
							  <div class='input_cell' id='direction_detail_page'></div>	
							  <div class='label_cell'>技术等级</div>
							  <div class='input_cell' id='road_lv_detail_page'></div>
							</div>
							<div class='input_row_div'>
							  <div class='label_cell'>开始桩号</div>
							  <div class='input_cell' id='start_pile_detail_page'></div>
							  <div class='label_cell'>结束桩号</div>
							  <div class='input_cell' id='end_pile_detail_page'></div>							  
							</div>
							<div class='input_row_div'>
							  <div class='label_cell'>实际里程</div>
							  <div class='input_cell' id='distance_detail_page'></div>						
							  <div class='label_cell'>路段长度</div>
							  <div class='input_cell' id='road_long_detail_page'></div>
							</div>
							<div class='input_row_div'>
							  <div class='label_cell'>路面宽度</div>
							  <div class='input_cell' id='road_face_width_detail_page'></div>
							  <div class='label_cell'>路面面积</div>
							  <div class='input_cell' id='road_face_area_detail_page'></div>
							</div>
							<div class='input_row_div'>
							  <div class='label_cell'>路基宽度</div>
							  <div class='input_cell' id='road_base_width_detail_page'></div>							
							  <div class='label_cell'>面层厚度</div>
							  <div class='input_cell' id='road_face_thickness_detail_page'></div>
							</div>						
							<div class='input_row_div'>
							  <div class='label_cell'>设计时速</div>
							  <div class='input_cell' id='road_speed_detail_page'></div>							
							  <div class='label_cell'>车道数量</div>
							  <div class='input_cell' id='road_lane_count_detail_page'></div>
							</div>
							<div class='input_row_div'>
							  <div class='label_cell'>路面类型</div>
							  <div class='input_cell' id='road_face_type_detail_page'></div>	
							  <div class='label_cell'>巡查部门</div>
							  <div class='input_cell' id='respon_department_detail_page'></div>								  
							</div>
							<div class='input_row_div'>								
							  <div class='label_cell'>保洁部门</div>
							  <div class='input_cell' id='clean_department_detail_page'></div>
							  <div class='label_cell'>修理部门</div>
							  <div class='input_cell' id='fix_department_detail_page'></div>
							</div>
							<div class='input_row_div'>
							  <div class='label_cell'>养护单位</div>
							  <div class='input_cell' id='road_unit_page'></div>								
							</div>
							<div class='input_row_div'>
							  <div class='label_cell'>建成时间</div>
							  <div class='input_cell' id='road_build_time_detail_page'></div>							
							  <div class='label_cell'>最近检修时间</div>
							  <div class='input_cell' id='road_fix_time_detail_page'></div>
							</div>						
							<div class='input_row_div'>
							  <div class='label_cell'>开始</div>
							  <div class='input_cell' id='start_pos_detail_page'></div>							
							  <div class='label_cell'>结束</div>
							  <div class='input_cell' id='end_pos_detail_page'></div>
							</div>
							<div class='input_row_div'>
							  <div class='label_cell'>描述</div>
							  <div class='input_cell' id='road_desc_detail_page'></div>
							</div>							
						  </div>
						</div>
						<div id='export_table_div' class='input_table_div'>
							<h2>导出设置</h2>
							<div class='input_table'>
								<div class = 'export_row_div'>
									<div class='label_cell'>导出格式</div>
									<select id = 'export_type' class ='input_cell'>
										<option value = 'JSON' selected>JSON</option>	
										<option value = 'JSONGPS'>JSON大地坐标系</option>
										<option value = 'TXT'>TXT</option>
										<option value = 'XLSX'>XLSX</option>
									</select>
								</div>
								<div class='export_row_div'>
									<div class ='input_cell' id = 'export_checkbox_div'style = 'flex-wrap: wrap;gap:10px;'>
									</div>							
								</div>
							</div>	
								<div style="display:flex;width:300px;flex-direction:row;justify-content:center;align-items: center;gap:10px;">
										<button id="export_confirmButton">导出</button>	
								</div>						
						</div>
						<div id='get_map_table_div' class='input_table_div'>
							<h2>输出地图设置</h2>
							<div class='input_table'>
								<div class = 'input_row_div'>
								  <div class='label_cell'>是否标注</div>							
								  <select class='input_cell' id='get_map_mark_mode_input'>
									<option value = '模式一' >模式一</option>
									<option value = '模式二' selected>模式二</option>
									<option value = '否'>否</option>
								  </select>							
								  <div class='label_cell'>标注内容</div>
								  <select class='input_cell' id='get_map_mark_key_input'>
									<option value = 'road_name' selected>路线名</option>
									<option value = 'road_country_id' >路线编号</option>
									<option value = 'respon_department'>巡查部门</option>
								  </select>						  
								</div>
								<div class = 'input_row_div'>
								  <div class='label_cell'>最小经度</div>
								  <input type = 'number' class='input_cell' id='get_map_x_min_input'></input>	
								  <div class='label_cell'>最小纬度</div>
								  <input type = 'number' class='input_cell' id='get_map_y_min_input'></input>							  
								</div>
								<div class = 'input_row_div'>
								  <div class='label_cell'>最大经度</div>
								  <input type = 'number' class='input_cell' id='get_map_x_max_input'></input>	
								  <div class='label_cell'>最大纬度</div>
								  <input type = 'number' class='input_cell' id='get_map_y_max_input'></input>							  
								</div>							
								<div class = 'input_row_div'>
								  <div class='label_cell'>字体颜色</div>
								  <input class='input_cell' id='get_map_mark_color_input' placeholder="输入16进制颜色"></input>	
								  <div class='label_cell'>标注尺寸</div>
								  <input type = 'number' class='input_cell' id='get_map_mark_scale_input' value = '0.6' ></input>							  
								</div>
								<div class = 'input_row_div'>
								  <div class='label_cell'>背景颜色</div>
								  <input class='input_cell' id='get_map_mark_back_input'  value = '255,255,255,0' ></input>
								  <div class='label_cell'>背景线宽</div>
								  <input type = 'number' class='input_cell' id='get_map_mark_line_input' value= '0'></input>
								</div>
								<div class = 'input_row_div'>
								  <div class='label_cell'>路线最短长度</div>
								  <input type = 'number' class='input_cell' id='get_map_mark_limit_input' style='flex:1;' value = '0'></input>							  
								</div>	
								<div class = 'input_row_div'>
								  <div class='label_cell'>标注间隔</div>
								  <input class='input_cell' id='get_map_mark_distance_input' value = "1000"></input>							
								  <div class='label_cell'>字体间距</div>
								  <input class='input_cell' id='get_map_mark_str_distance_input' value = '200'></input>							
								</div>
								<div class = 'input_row_div'>
								  <div class='label_cell'>缩放参数</div>
								  <input type = 'number' class='input_cell' id='get_map_zoom_scale_input' value = '15' ></input>
								  <div class='label_cell'>扫描时间</div>
								  <input type = 'number' class='input_cell' id='get_map_wait_time_input' value = '1500'></input>
								</div>
								<div class='input_row_div'>
								  <div class='label_cell'>路线宽度</div>
								  <input type = 'number' class='input_cell' id='get_map_line_width_input' value = '6'></input>
								  <div class='label_cell'>透明度</div>
								  <input type = 'number' class='input_cell' id='get_map_line_alpha_input' value = '1'></input>
								</div>
								<div class='input_row_div'>
								  <div class='label_cell'>颜色设置</div>
								  <select class='input_cell' id='get_map_color_select' style = 'flex:1'>
										<option value = '' selected>无</option>
										<option value = 'road_class'>行政等级</option>
										<option value = 'respon_department'>巡查部门</option>
								  </select>
								</div>
								<div  id = 'get_map_color_menu_div'>						
								</div>
							</div>
							<div style="display:flex;width:300px;flex-direction:row;justify-content:center;align-items: center;gap:10px;">
									<button id="get_map_drawButton">获取范围</button>	
									<button id="get_map_confirmButton">开始导出</button>	
							</div>						
						</div>
					</div>
				</div>
			</div>		
			<div id="container">
				<div id = 'sidebar'>
					<div id = "card">
						<div class="input-card">
							<div id ="road_info_div">
								<div id ="road_info">
								</div>
								<div style = 'display:flex;flex-direction:row;justify-content:center;width:100%;gap:2px'>
									<button id = 'hide_select_line_button'>隐藏路线</button>
									<button id = 'detail_page_button'>详细信息</button>	
									<button id ='draw_route_button' data-mode = 'none'>新增路线</button>
								</div>							
							</div>						
							<div style = 'display:flex;width:100%; flex-direction:column;gap:5px;'>				
								<div id = 'edit_div'>
									<div style='width:100%;flex-direction:row;display:flex;gap:5px;'>
										<button id ='drag_mode_buton' data-mode = 'off'>拖拽模式</button>							
									</div>	
									<div style='width:100%;flex-direction:row;display:flex;gap:5px;'>
										<button id ='clear_draw_mark'  class = 'danger_button'>清空</button>									
										<button id ='back_route_button' class = 'danger_button'>撤销</button>							
									</div>
									<div style='width:100%;flex-direction:row;display:flex;gap:5px;'>
										<button id ='change_info_button' >修改信息</button>
										<button id ='add_coordinates_button' >添加坐标</button>									
									</div>
									<div style='width:100%;flex-direction:row;display:flex;gap:5px;'>
										<button id ='export_route_button' >导出</button>
										<button id ='save_route_button' >保存</button>
									</div>								
								</div>
							</div>
							<div id = 'fly_mode_button' class = 'sidebar_button'>绘制无人机服务区域 ▼</div>
							<div id= 'fly_mode_div'>							
								<div  id =  'fly_mode_menu'>
									<div class="input_div">
										<label for="gpslng_input">中心点经度(GPS)：</label>
										<input type="text" id="gpslng_input" placeholder="例如：116.397428">
									</div>
									<div class="input_div">
										<label for="gpslat_input">中心点纬度(GPS)：</label>
										<input type="text" id="gpslat_input" placeholder="例如：39.90923">
									</div>
									<div class="input_div">
										<label for="lng_input">中心点经度(GCJ02)：</label>
										<input type="text" id="lng_input" placeholder="例如：116.397428">
									</div>
									<div class="input_div">
										<label for="lat_input">中心点纬度(GCJ02)：</label>
										<input type="text" id="lat_input" placeholder="例如：39.90923">
									</div>
									<div class="input_div">
										<label for="radius_input">半径(米)：</label>
										<input type="number" id="radius_input" placeholder="例如：1000" min="1">
									</div>
									<div style='width:100%;flex-direction:row;display:flex;gap:5px;'>
										<button id ='draw_circle_button'>绘制区域</button>
										<button id ='clear_circle_mark_button' class = 'danger_button' >清除标记</button>
									</div>
									<div style='width:100%;flex-direction:row;display:flex;gap:5px;'>
										<button class="copy-btn" >复制坐标</button>
									</div>
								</div>
							</div>							
						</div>					
					</div>		
				</div>
				<div id = 'outdiv' style='position:relative;width:100%;height:100%;padding:0;margin:0;flex-direction:column;'>
					<div id = 'prompt_info_div' class = 'alert_info_div'>
					</div>
					<div class="lay_div" style = "top:20px;left:20px;">
						<div style ='width:100%;display:flex;flex-direction:column;gap:5px;'>
							<div style ='width:100%;display:flex;flex-direction:row;gap:5px;'>
								<input type="checkbox" id="basic_lay_check" class='lay_check' checked>
								<label for="basic_lay_check">基础图层</label>
							</div>
							<div style ='width:100%;display:flex;flex-direction:row;gap:5px;'>
								<input type="checkbox" id="photo_lay_check" class='lay_check' >
								<label for="photo_lay_check">卫星图层</label>
							</div>					
							<div style ='width:100%;display:flex;flex-direction:row;gap:5px;'>
								<input type="checkbox" id="road_lay_check" class='lay_check' checked>
								<label for="road_lay_check">路网图层</label>
							</div>					
							<div style ='width:100%;display:flex;flex-direction:row;gap:5px;'>
								<input type="checkbox" id="city_part_lay_check" class='lay_check' checked>
								<label for="city_part_lay_check">行政图层</label>
							</div>
						</div>
					</div>
					<div class="search-container">
						<div style ='width:100%;display:flex;flex-direction:column'>
							<div style ='width:100%;display:flex;flex-direction:row;gap:2px;'>
								<button id ='get_distance_button' style = 'width:15%;'data-mode = 'off'>测距</button>
								<input type="text" style = 'width:55%' id="search_input" placeholder="请输入地址...">
								<button id ='search_button' style = 'width:15%;'>搜索</button>
								<button id ='search_clear_button' class = 'danger_button' style = 'width:15%;'>清除</button>
							</div>
							<div id="search_result_div" class = 'dropdown' >					
								<div id = 'item_div'>
								</div>
								<div id = 'search_page'>
									<div id = 'back_page' class = 'seach_div' style = 'margin-right:auto;'>上一页</div>
											 <div id = 'page_info' >
												<div id="page_index_div"></div>
												<div>/</div>
												<div id = "total_page_div"></div>
											 </div>
									<div id = 'forward_page' class = 'seach_div' style = 'margin-left:auto;'>下一页</div>
								</div>
							</div>
						</div>
					</div>
					<div id = 'display_div' style='width:100%;height:100%;padding:0;margin:0;overflow:auto;'>
						<div id = 'map_div'>					
						</div>
					</div>
					<div id = 'line_table_div'>
						<div style = 'display:flex;width:100%;'>
							<div id = 'edit_table_button_div' style='display:flex;margin-right:auto;gap:2px;pointer-events: auto;'>
								<input type="file" id="file_input" multiple accept=".json,.txt" style='display:none';>
								<button id="load_line_button">导入路径数据</button>
								<button id ='get_pile_button' >计算桩号</button>
								<button id = 'hide_line_button' style="">隐藏选中路段</button>
								<button id = 'display_line_button' style="">显示选中路段</button>									
								<button id = 'edit_line_button' style="">编辑选中路段</button>
								<button id = 'export_line_button' >导出选中路段</button>
								<button id="map_out_button">导出地图</button>	
								<button id = 'key_manage_button' >秘钥管理</button>
								<button id = 'delete_line_button' class = 'danger_button' >删除选中路段</button>									
							</div>
							<div style='display:flex;margin-left:auto;gap:2px;pointer-events: auto;'>
								<button id = 'filte_button' class = 'filte_button'>筛选表格</button>
								<button id = 'hide_table_button' >隐藏表格</button>
							</div>
						</div>
						<div id = 'hide_table_div'>
							<div id = 'table1_div'>
								<table id="table1">
									<thead id = 'table1thead'>
									</thead>
									<tbody id = 'table1body'>
									</tbody>
								</table>
							</div>
						</div>
					</div>
				</div>			
			</div>
		</div>
	</div>
	<script src = "zip.js"></script>
	<script src = "coordtransform.js"></script>
	<script src = "get_xlsx.js"></script>
	<script>
		//----------状态相关参数START---------
		let state = {
			lock: false,//用于锁定导航规划时候的异步状态，避免连续多次规划路线
			is_draw_route:false,//用于判断是否处于编辑路线状态
			is_drag_mode:false,//用于判断是否处于编辑路线中的拖拽模式
			is_pile_mode:false
		};
		let table_line_set = new Set(); //经过表格更新后显示的路线
		//状态控制
		let draw_line_obj = {  //编辑路线时候路线的信息
			route:null, //导航信息
			line:null,//路线实例
			distance:0,//长度
			start_mark:null,//开始标志
			end_mark:null,//结束标志
			check_point:[],//检查点
			path_point:[],//路径点
			info:{}
		};
		//----------地图参数START----------
		let line_map = new Map(); //存储路段和其相关信息的映射		
		let gaode ={
			basic_line_color:"#0091ff", //路段颜色
			select_line_color:"#FF4500",//选中路段颜色
			drog_line_color:'#1CAB2D',
			basic_line_width:6,
			basic_line_alpha:1
		}
		let map = null;
		let mouseTool = null;
		let placeSearch = null;
		let Ranging = null;
		let click_icon = null;//点击图标
		let select_line_id = ""//选择的线的id(通过地图的选择)
		let circle_obj_arr = [];//存放无人机服务区的图形实例与信息的对象的数组
		//----------地图参数END----------
	</script>
	<script> //ui相关操作
		let open_menu_set = new Set();
		let select_set = new Set(); //选择的路段id的集合（表格选择）
		let win_set = new Set(); //用于存放打开窗口的set
		function alert_fix(content){
			return new Promise((resolve)=>{
				let win_modal = document.getElementById('win_modal');
				let alert_div = document.getElementById('alert_div')
				let alert_text_div = document.getElementById('alert_text_div')
				alert_text_div.textContent = content;
				alert_div.style.display = 'flex';
				win_modal.style.display = 'flex';
				win_set.add('alert');
				function alert_confirm(event){
					if(event.target.closest('#alert_confirm_button')){
						alert_text_div.textContent = "";
						alert_div.style.display = "none"
						win_set.delete('alert');
						if(win_set.size === 0){
							win_modal.style.display = 'none';
						}
						alert_div.removeEventListener('click', alert_confirm);
						resolve()
					}
				}
				alert_div.addEventListener('click',alert_confirm)
			})
		}
		function confirm_fix(content){
			return new Promise((resolve)=>{
				let win_modal = document.getElementById('win_modal');
				let confirm_text_div = document.getElementById('confirm_text_div')		
				let confirm_div = document.getElementById('confirm_div')
				confirm_text_div.textContent = content;
				confirm_div.style.display = 'flex';
				win_modal.style.display = 'flex';
				win_set.add('confirm')
				function confirm_confirm(event){
					if(event.target.closest('#confirm_confirm_button')){
						confirm_text_div.textContent = "";
						confirm_div.style.display = "none"
						win_set.delete('confirm')
						if(win_set.size === 0){
							win_modal.style.display = 'none';
						}
						confirm_div.removeEventListener('click', confirm_confirm);
						resolve(true)
					}else if(event.target.closest('#confirm_cance_button')){
						confirm_text_div.textContent = "";
						confirm_div.style.display = "none"
						win_set.delete('confirm');
						if(win_set.size === 0){
							win_modal.style.display = 'none';
						}
						confirm_div.removeEventListener('click', confirm_confirm);
						resolve(false)
					}
				}
				confirm_div.addEventListener('click',confirm_confirm)
			})
		}
		function prompt_fix(content){
			return new Promise((resolve)=>{
				let win_modal = document.getElementById('win_modal');
				let prompt_text_div = document.getElementById('prompt_text_div')	
				let prompt_div = document.getElementById('prompt_div')
				prompt_text_div.textContent = content;
				prompt_div.style.display = 'flex';
				win_modal.style.display = 'flex';
				win_set.add('prompt')
				function prompt_confirm(event){
					if(event.target.closest('#prompt_confirm_button')){
						prompt_text_div.textContent = "";
						prompt_div.style.display = "none"
						win_set.delete('prompt')
						if(win_set.size === 0){
							win_modal.style.display = 'none';
						}
						prompt_div.removeEventListener('click', prompt_confirm);
						resolve(document.getElementById('prompt_input').value)
					}else if(event.target.closest('#prompt_cance_button')){
						prompt_text_div.textContent = "";
						prompt_div.style.display = "none"
						win_set.delete('prompt');
						if(win_set.size === 0){
							win_modal.style.display = 'none';
						}
						prompt_div.removeEventListener('click', prompt_confirm);
						resolve(null)
					}
				}
				prompt_div.addEventListener('click',prompt_confirm)
			})
		}
		function updata_table(map){ //更新表格内容（因为路线管理普遍在百条以内，所以没必要做优化，直接清空表格重新加载即可）
			select_set.clear();
			table_line_set.clear();
			document.getElementById('table1body').innerHTML = "";
			document.getElementById('all_check').checked = false;
			document.getElementById('table1_div').scrollTo({ top:0});
			let temp_div = document.createDocumentFragment();
			let line_obj_arr = Array.from(map.values());
			function sort_filte(obj1,obj2){
				for(let element of check_filte_arr){
					if(element){
						let key = element['key']
						if(obj1[key]!=obj2[key]){
							let sort = element['way']
							let result = sort(key,obj1,obj2)
							return result;
						}
					}
				}
				return 0;
			}
			line_obj_arr.sort(sort_filte);
			for(let [key,value] of line_map){
				if(value.line){
					value.line.hide()
				}
				if(value.start_mark){
					value.start_mark.hide()
				}
				if(value.end_mark){
					value.end_mark.hide();
				}					
			}
			for(let line_obj of line_obj_arr){
				table_line_set.add(line_obj.road_part_id)
				const tabletr = document.createElement('tr');
				tabletr.dataset.id = line_obj.road_part_id;
				let line = line_obj.line;
				if(line){
					if(line_obj.display){
						line.show();
						if(line_obj.start_mark){
							line_obj.start_mark.show();
						}
						if(line_obj.end_mark){
							line_obj.end_mark.show();
						}
					}else{
						line.hide();
						if(line_obj.start_mark){
							line_obj.start_mark.hide();
						}
						if(line_obj.end_mark){
							line_obj.end_mark.hide();
						}					
					
					}
				}
				tabletr.className = 'tabletr';			
				for(let key of table_key_arr){
					let td = document.createElement('td');
					if(road_data[key].display_str){
						let  display_str= road_data[key].display_str(key,line_obj);
						td.textContent = display_str
					}else{
						td.textContent = "";
					}
					td.className = key+'_td'
					tabletr.appendChild(td);
				}
				let td = document.createElement('td');
				td.className = 'select_td'			
				let check_box = document.createElement('input');
				check_box.type ="checkbox"
				check_box.className = "row-check"
				td.appendChild(check_box);
				tabletr.appendChild(td);				
				temp_div.appendChild(tabletr);
			}		
			document.getElementById('table1body').appendChild(temp_div);
		}
		function drag_mode_on(){
			state.is_drag_mode = true;
			document.getElementById('drag_mode_buton').textContent = '布点模式';
			document.getElementById('drag_mode_buton').dataset.mode = 'on';
			let line = draw_line_obj.line;
			let start_mark = draw_line_obj.start_mark;
			let end_mark = draw_line_obj.end_mark;
			if(line){
				map.remove(line);
				line.destroy();
				draw_line_obj.line = null;
			}
			if(start_mark){
				map.remove(start_mark);
				start_mark.destroy();
				draw_line_obj.start_mark = null;
			}
			if(end_mark){
				map.remove(end_mark);
				end_mark.destroy();
				draw_line_obj.end_mark = null;
			}
			if(draw_line_obj.check_point.length>1){
				if(click_icon){
					map.remove(click_icon);
					click_icon.destroy();
					click_icon = null;
				}
			}
		}
		function drag_mode_off(){
			state.is_drag_mode = false;
			document.getElementById('drag_mode_buton').textContent = '拖拽模式';
			document.getElementById('drag_mode_buton').dataset.mode = 'off';
			let line = draw_line_obj.line;
			let start_mark = draw_line_obj.start_mark;
			let end_mark = draw_line_obj.end_mark;
			if(line){
				map.remove(line);
				line.destroy();
				draw_line_obj.line = null;
			}
			if(start_mark){
				map.remove(start_mark);
				start_mark.destroy();
				draw_line_obj.start_mark = null;
			}
			if(end_mark){
				map.remove(end_mark);
				end_mark.destroy();
				draw_line_obj.end_mark = null;
			}
		}
		function draw_route_off(){
			state.is_draw_route = false;
			drag_mode_off();
		}
		function create_all_check_cell(){
			const th = document.createElement('th');
			th.id = 'table_select_check_th';
			th.className = 'table1th';
			th.style.width = '6%';
			const div = document.createElement('div');
			div.style.display = 'flex';
			div.style.flexDirection = 'row';
			div.style.justifyContent = 'center';
			div.style.alignItems = 'center';
			const label = document.createElement('label');
			label.htmlFor = 'all_check';
			label.textContent = '全选';
			const checkbox = document.createElement('input');
			checkbox.type = 'checkbox';
			checkbox.id = 'all_check';
			checkbox.value = 'allselect';
			div.appendChild(label);
			div.appendChild(checkbox);
			th.appendChild(div);
			return th;
		}
		function close_opening_menu(set) {
			 for (let dom of set) {
				dom.classList.remove('expanded'); // 移除展开样式
			}
			set.clear(); // 清空记录
		}		
		function delete_opening_menu(set) {
			 for (let dom of set) {
				dom.remove(); // 移除展开样式
			}
			set.clear(); // 清空记录
		}
		function expand_menu(dom,set){
			let old_size = set.size
			set.add(dom)
			let new_size = set.size
			if(old_size<new_size){
				dom.classList.add('expanded');
			}
		}
		function modal_work(mode,id){ 
			let div_arr = document.getElementById('modal_table_div').querySelectorAll('.input_table_div');
			if(mode){
				for(let div of div_arr){
					div.style.display = 'none';	
				}
				let target_div = document.getElementById(id);
				target_div.style.display = 'flex';
				document.getElementById('myModal').style.display = 'flex';
			}else{
				document.getElementById('myModal').style.display = 'none';
				for(let div of div_arr){
					div.style.display = 'none';	
				}
			}
		}
		function clear_input_cell(){
			let input_cell_arr = road_info_table.querySelectorAll('.input_cell');
			for(let input_cell of input_cell_arr){
				let key = input_cell.id.substring(0, input_cell.id.length - 6);
				if(road_data[key]){
					let value = road_data[key].read_default;
					road_data[key].input.write(key,value);
					
				}
			}
		}
		function clear_detail_cell(){
			let cell_arr = document.getElementById('detail_table_div').querySelectorAll('.input_cell');
			for(let cell of cell_arr){
				cell.textContent = "";
			}
		}
		function click_filte_input(key){ //获取下拉菜单
			if(!road_data[key].filte||!road_data[key].filte.dropdown){
				return;
			}
			let filte_arr = road_data[key].filte.dropdown(key);
			let item_div = document.getElementById('filte_'+key+'_item_div')
			if(!item_div){
				return;
			}
			item_div.innerHTML = '';
			if(filte_arr.length === 0){
				return;
			};
			for(let element of filte_arr){
				let optionElement = document.createElement('div');
				optionElement.textContent = element;
				optionElement.dataset.value = element;
				optionElement.classList.add('dropdown-item');
				item_div.appendChild(optionElement)
			}
			let dropdown_menu = document.getElementById('filte_'+key+'_dropdown')
			expand_menu(dropdown_menu,open_menu_set)
		}
		function creat_check_box_cell(label_name,id,value,mode){
			let checkbox_div = document.createElement('div');
			checkbox_div.className = 'checkbox_div'
			let checkbox = document.createElement('input');
			checkbox.type = 'checkbox';
			if(mode){
				checkbox.checked = true;
			}
			checkbox.id = id
			checkbox.className = 'export_checkbox';
			checkbox.dataset.key = value
			let label = document.createElement('label');
			label.textContent = label_name;
			label.htmlFor = id;
			checkbox_div.appendChild(label)
			checkbox_div.appendChild(checkbox)
			return checkbox_div;
		}
		function create_checkbox_div(){
			let export_checkbox_div = document.getElementById('export_checkbox_div');
			export_checkbox_div.innerHTML = "";	
			if(document.getElementById('export_type').value ==='JSON'){
				export_checkbox_div.style.display = 'none';
				return;
			}else if(document.getElementById('export_type').value ==='TXT'){
				export_checkbox_div.style.display = 'flex';
				for(let key in road_data){
					if(road_data[key].is_export&&road_data[key].export_data&&key!='road_part_id'){
						if(road_data[key].type === 'string'||road_data[key].type === 'number'){ //用于设置设定参数的函数
							let id = 'export_'+key+'_checkbox';
							let label_name = road_data[key].name
							let checkbox_div = creat_check_box_cell(label_name,id,key,true);
							export_checkbox_div.appendChild(checkbox_div)
						}
					}
				}
			}else if(document.getElementById('export_type').value ==='XLSX'){
				export_checkbox_div.style.display = 'flex';
				for(let key in road_data){
					if(road_data[key].is_export&&road_data[key].export_data&&key!='road_part_id'){
						if(road_data[key].type === 'string'||road_data[key].type === 'number'){ //用于设置设定参数的函数
							let id = 'export_'+key+'_checkbox';
							let label_name = road_data[key].name
							let checkbox_div = creat_check_box_cell(label_name,id,key,true);
							export_checkbox_div.appendChild(checkbox_div)
						}
					}
				}
				let checkbox_div = creat_check_box_cell('地图','export_'+'road_map'+'_checkbox','road_map',true);
				export_checkbox_div.appendChild(checkbox_div)
			}
		}
		function setting_map_color_menu(){
			document.getElementById('get_map_color_menu_div').innerHTML = "";
			let key = document.getElementById('get_map_color_select').value;
			let op_set = new Set();
			if(key){
				for(let [road_part_id,line_obj] of line_map){
					op_set.add(line_obj[key])
				}
			}
			let op_arr = Array.from(op_set);
			op_arr.sort();
			for(let op of op_arr){
				let label_div = document.createElement('div');
				label_div.className = 'label_cell'
				label_div.textContent = op
				let input = document.createElement('input');
				input.className = 'get_map_menu_input_cell'
				input.placeholder="输入16进制颜色"
				input.dataset.value = op;
				let input_div = document.createElement('div');
				
				input_div.className = 'get_map_row_div';
				input_div.appendChild(label_div);
				input_div.appendChild(input)
				document.getElementById('get_map_color_menu_div').appendChild(input_div)
			}
		}
		function get_seach_menu(key_word,page){ //搜索函数
			placeSearch.clear();
			if(key_word){
				placeSearch.setPageIndex(page);
				placeSearch.search(key_word, function (status, result) {
				   if(status === 'complete'){
						let totalPages = Math.ceil(result.poiList.count / result.poiList.pageSize)||1;
						document.getElementById('page_index_div').textContent = String(result.poiList.pageIndex);
						document.getElementById('total_page_div').textContent = String(totalPages);
						let seach_result_arr = result.poiList.pois;
						document.getElementById('item_div').innerHTML = '';
						document.getElementById('item_div').scrollTo({ top:0});
						for(let info of seach_result_arr){
							let optionElement = document.createElement('div');
								optionElement.textContent = info.name;
							let location = info.location;
								optionElement.dataset.location = location.lng+','+location.lat;
								optionElement.classList.add('dropdown-item');
								document.getElementById('item_div').appendChild(optionElement);
						}
						document.getElementById('search_result_div').classList.add('expanded');
				   }
				})
			}	
		}
		function creat_alert_info(content){
			let span = document.createElement('span');
			span.className = 'alert_info';
			span.textContent = content;
			document.getElementById('prompt_info_div').appendChild(span);
		}
		function delete_alert_info(){
			let result_arr = document.getElementById('prompt_info_div').querySelectorAll('.alert_info');
			if(result_arr){
				for(let span of result_arr){
					if(span){
						span.remove()
					}
				}
			}
		}
		async function creat_auto_destroy_info(content,ms){
			let span = document.createElement('span');
			span.className = 'filte_info';
			span.textContent = content;
			document.getElementById('prompt_info_div').appendChild(span);
			await delay(ms);
			if(span){
				span.remove();
			}
		}
		function open_key_save_win(){
			document.getElementById('key_setting_div').style.display = 'flex';
			document.getElementById('win_modal').style.display = 'flex';
			win_set.add('key_save');
		}
		function close_key_save_win(){
			document.getElementById('key_setting_div').style.display = 'none';
			win_set.delete('key_save');
			if(win_set.size === 0){
				document.getElementById('win_modal').style.display = 'none';
			}
		}
	</script>
    <script> //数据结构与处理		
		let road_data = {
			road_id:{
				name:'路线识别码',
				type:'string', //数据格式
				read_default:null,//默认值
				input:{type:'input',//信息编辑页面，需同步更新编辑页面输入框，且id和class必须符合规律
					read:get_input_value,//信息编辑页面对应字段的读取信息的函数
					write:set_input_value//信息编辑页面对应字段的写入信息的函数
				},
				
				filte:{type:'input',//筛选页面，需同步更新筛选页面输入框，且id和class必须符合规律
					read:get_filte_text,//筛选页面对应字段的读取信息的函数
					write:set_filte_text,//筛选页面页面对应字段的写入信息的函数
					dropdown:null,//筛选页面页面对应字段下拉框数据获取函数，null为无下拉框。
					check:filte_road_id_input //检测算法						
				},
				table:{
					width:null,
					index:null,
					sort:{index:0,way:number_compare}//表格的排序优先级和排序算法
				},
				display_str:get_display_value,//表格的以及dom的显示逻辑
				info_display:null,//是否在显示框显示诗句
				is_export:true,//导出时是否携带此字段
				export_data:export_data,//写入导出对象的函数
				load_read:get_load_read//导入时候的读取对象对应字段的函数
			},
			road_part_id:{
				name:'路段识别码',
				type:'string',
				read_default:null,
				input:{type:'input',
					read:get_road_id_input_value,
					write:set_road_id_input_value
				},
				table:{
					width:'8%',
					index:0,
					sort:{index:1,way:road_part_id_compare}
				},
				display_str:get_display_value,
				info_display:{index:0},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			is_work:{
				name:'是否启用',
				type:'string',
				read_default:'是',
				input:{type:'select',				
					read:get_input_value,
					write:set_select_value
				},
				
				filte:{type:'select',
					read:get_filte_text,
					write:set_filte_text,
					dropdown:null,
					check:filte_input
				},
				display_str:get_display_value,
				info_display:null,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_name:{
				name:'路线名称',
				type:'string',
				read_default:null,
				input:{type:'input',				
					read:get_input_value,
					write:set_input_value
				},
				filte:{type:'select',
					read:get_filte_text,
					write:set_filte_text,
					dropdown:null,
					check:filte_input
				},				
				table:{
					width:'20%',
					index:6,
					sort:{index:5,way:str_compare}//表格的排序优先级和排序算法
				},				
				display_str:get_display_value,
				info_display:{index:1},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},			
			road_country_id:{
				name:'路线编号',
				type:'string',
				read_default:null,
				input:{type:'input',				
					read:get_input_value,
					write:set_input_value,
				},
				filte:{type:'input',
					read:get_filte_text,
					write:set_filte_text,
					dropdown:null,
					check:filte_input
				},
				table:{
					width:'7%',
					index:5,
					sort:null
				},
				display_str:get_display_value,
				info_display:{index:2},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_class:{
				name:'行政等级',
				type:'string',
				read_default:'县道',	
				input:{type:'slect',			
					read:get_input_value,
					write:set_input_value,
				},
				filte:{type:'checkbox',
					read:null,
					write:null,
					dropdown:null,
					check:filte_checkbox
				},
				table:{
					width:'7%',
					index:7,
					sort:null
				},
				display_str:get_display_value,
				info_display:{index:3},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_lv:{
				name:'技术等级',
				type:'string',
				read_default:null,				
				input:{type:'select',
					read:get_input_value,
					write:set_select_value
				},
				filte:{type:'select',
					read:get_filte_text,
					write:set_filte_text,
					dropdown:get_filte_arr,
					check:filte_input
				},
				display_str:get_display_value,
				info_display:{index:4},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			respon_department:{
				name:'巡查部门',
				type:'string',
				read_default:null,			
				input:{type:'input',				
					read:get_input_value,
					write:set_input_value
				},					
				filte:{type:'input',
					read:get_filte_text,
					write:set_filte_text,
					dropdown:get_filte_arr,
					check:filte_input
				},
				table:{
					width:'8%',
					index:2,
					sort:{index:4,way:str_compare}
				},
				display_str:get_display_value,
				info_display:{index:5},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			clean_department:{
				name:'保洁部门',
				type:'string',
				read_default:null,
				input:{type:'input',
					read:get_input_value,
					write:set_input_value
				},
				filte:{type:'input',
					read:get_filte_text,
					write:set_filte_text,
					dropdown:get_filte_arr,
					check:filte_input
				},
				display_str:get_display_value,
				info_display:{index:6},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			fix_department:{
				name:'修理部门',
				type:'string',
				read_default:null,			
				input:{type:'input',				
					read:get_input_value,
					write:set_input_value
				},				
				filte:{type:'input',
					read:get_filte_text,
					write:set_filte_text,
					dropdown:get_filte_arr,
					check:filte_input
				},
				display_str:get_display_value,
				info_display:{index:7},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_unit:{
				name:'养护单位',
				type:'string',
				read_default:null,			
				input:{type:'input',				
					read:get_input_value,
					write:set_input_value
				},				
				filte:{type:'input',
					read:get_filte_text,
					write:set_filte_text,
					dropdown:get_filte_arr,
					check:filte_input
				},
				display_str:get_display_value,
				info_display:{index:8},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			direction:{
				name:'方向',
				type:'string',
				read_default:'双向',			
				input:{type:'select',				
					read:get_input_value,
					write:set_select_value
				},				
				filte:{type:'select',
					read:get_filte_text,
					write:set_filte_text,
					dropdown:null,
					check:filte_input
				},
				table:{
					width:'5%',
					index:2,					
					sort:{index:3,way:str_compare}
				},
				display_str:get_display_value,
				info_display:{index:9},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			start_pile:{
				name:'开始桩号',
				type:'number',
				read_default:null,				
				input:{type:'input',			
					read:get_input_value_as_number,
					write:set_input_value
				},
				table:{
					width:'8%',
					index:3,	
					sort:{index:2,way:number_compare}
				},
				display_str:get_display_pile,
				info_display:{index:10},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			end_pile:{
				name:'结束桩号',
				type:'number',
				read_default:null,			
				input:{type:'input',				
					read:get_input_value_as_number,
					write:set_input_value,
				},
				table:{
					width:'8%',
					index:4,
					sort:null
				},
				display_str:get_display_pile,
				info_display:{index:11},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_ad_name:{
				name:'行政区划名称',
				type:'string',
				read_default:null,
				input:{type:'input',				
					read:get_input_value,
					write:set_input_value
				},			
				display_str:get_display_value,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},			
			road_ad_code:{
				name:'行政区划代号',
				type:'string',
				read_default:null,
				input:{type:'input',				
					read:get_input_value,
					write:set_input_value
				},			
				display_str:get_display_value,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_face_type:{
				name:'路面类型',
				type:'string',
				read_default:null,
				input:{type:'input',				
					read:get_input_value,
					write:set_input_value
				},				
				display_str:get_display_value,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_build_time:{
				name:'建成时间',
				type:'number',
				read_default:null,				
				input:{type:'input',				
					read:get_input_value_as_number,
					write:set_input_value
				},				
				display_str:get_display_value,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_fix_time:{
				name:'最近检修时间',
				type:'number',
				read_default:null,				
				input:{type:'input',				
					read:get_input_value_as_number,
					write:set_input_value
				},				
				display_str:get_display_value,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_long:{
				name:'路段长度',
				type:'number',
				read_default:null,	
				input:{type:'input',			
					read:get_input_value_as_number,
					write:set_input_value
				},
				display_str:get_display_distance,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_face_width:{
				name:'路面宽度',
				type:'number',
				read_default:null,	
				input:{type:'input',			
					read:get_input_value_as_number,
					write:set_input_value
				},
				display_str:get_display_distance,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_base_width:{
				name:'路基宽度',
				type:'number',
				read_default:null,	
				input:{type:'input',			
					read:get_input_value_as_number,
					write:set_input_value
				},
				display_str:get_display_distance,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_face_thickness:{
				name:'面层厚度',
				type:'number',
				read_default:null,	
				input:{type:'input',			
					read:get_input_value_as_number,
					write:set_input_value
				},
				display_str:get_display_distance,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_speed:{
				name:'设计时速',
				type:'number',
				read_default:null,	
				input:{type:'input',			
					read:get_input_value_as_number,
					write:set_input_value
				},
				display_str:get_display_speed,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_lane_count:{
				name:'车道数量',
				type:'number',
				read_default:null,	
				input:{type:'input',			
					read:get_input_value_as_number,
					write:set_input_value
				},
				display_str:get_display_value,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			road_face_area:{
				name:'路面面积',
				type:'number',
				read_default:null,	
				input:{type:'input',			
					read:get_input_value_as_number,
					write:set_input_value
				},
				display_str:get_display_area,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},				
			distance:{
				name:'实际里程',
				type:'number',
				read_default:null,	
				input:{type:null,			
					read:null,
					write:null,
				},
				display_str:get_display_distance,
				info_display:{index:12},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},	
			start_pos:{
				name:'开始',
				type:'string',
				read_default:null,			
				input:{type:null,			
					read:null,
					write:null,
				},
				display_str:get_display_value,
				info_display:{index:13},
				is_export:false,
				export_data:null,
				load_read:get_start_pos_read
			},
			end_pos:{
				name:'结束',
				type:'string',
				read_default:null,			
				input:{type:null,				
					read:null,
					write:null,
				},
				display_str:get_display_value,
				info_display:{index:14},
				is_export:false,
				export_data:null,
				load_read:get_end_pos_read
			},
			road_desc:{
				name:'描述',
				type:'string',
				read_default:null,			
				input:{type:'input',				
					read:get_input_value,
					write:set_input_value,
				},
				table:{
					width:'25%',
					index:9,
					sort:null
				},
				display_str:get_display_value,
				info_display:{index:15},
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},			
			path_point:{
				name:'路径点',
				type:'array',
				read_default:[],
				display_str:null,
				info_display:null,
				is_export:true,
				export_data:export_path_point,
				load_read:get_path_point_read
			},
			check_point:{
				name:'检查点',
				type:'array',
				read_default:[],
				display_str:null,
				info_display:null,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			route:{
				name:'导航信息',
				read_default:null,			
				type:'object',
				display_str:null,
				info_display:null,
				is_export:true,
				export_data:export_data,
				load_read:get_load_read
			},
			display:{
				name:'显示',
				type:'Boolean',
				read_default:true,	
				is_export:false,
				load_read:get_load_read
			}			
		}
		//----------数据相关参数END----------	
		function get_input_value(key){
			let key_id = key+'_input'
			let dom = document.getElementById(key_id)
			if(dom){
				if(dom.value===""||dom.value===undefined||dom.value===null||dom.value==='暂无'){
					return null;
				}else{
					return dom.value;
				}
			}else{
				return null;
			}
		}
		function get_road_id_input_value(key){
			let direction = document.getElementById('direction_input').value
			let direction_id = 't'
			if(direction === '上行'){
				direction_id = 'u'
			}else if(direction === '下行'){
				direction_id = 'd'
			}
			let road_part_id = document.getElementById('road_id_input').value+'-'+document.getElementById('road_part_id_input').value+'-'+direction_id
			return road_part_id;
		}
		function get_input_value_as_number(key){
			let key_id = key+'_input'
			let dom = document.getElementById(key_id)
			if(dom){
				if(dom.value === ""){
					return null;
				}
				let result = Number(dom.value);
				if(!result&&result!== 0){
					return null;
				}else{
					return result;
				}
			}else{
				return null;
			}
		}
		function set_input_value(key,value){
			let key_id = key+'_input'
			let dom = document.getElementById(key_id)
			if(dom){
				if(value === null||value === undefined){
					dom.value = "";
				}
				dom.value = value;
			}
		}
		function set_select_value(key,value){
			let key_id = key+'_input'
			let dom = document.getElementById(key_id)
			if(dom){
				if(value === null||value === undefined){
					dom.value = "暂无";
				}
				dom.value = value;
			}
		}
		function set_road_id_input_value(key,value){
			let dom = document.getElementById('road_part_id_input');
			if(dom){
				if(value||value === ""){
					let arr =value.split('-');
					if(arr.length ===3){
						dom.value = arr[1];
					}else{
						dom.value = "";
					}
				}else{
					dom.value = "";
				}
			}
		};
		function get_display_value(key,obj){
			let str = "";
			if(obj[key] === undefined ||obj[key] ==null){
				str = '暂无';
			}else{
				str = obj[key]
			};
			return str;
		}
		function get_display_distance(key,obj){
			let str = "";
			if(obj[key] === undefined ||obj[key] ==null){
				str = '暂无';
			}else{
				str = String(obj[key])+'m';
			};
			return str;
		}
		function get_display_speed(key,obj){
			let str = "";
			if(obj[key] === undefined ||obj[key] ==null){
				str = '暂无';
			}else{
				str = String(obj[key])+'km/h';
			};
			return str;
		}
		function get_display_area(key,obj){
			let str = ""
			if(obj[key] === undefined ||obj[key] ==null){
				str = '暂无';
			}else{
				str = String(obj[key])+'m²';
			};
			return str;		
		}
		function get_display_pile(key,obj){
			let number = obj[key]
			let str = get_pile_by_number(number)
			if(str === null){
				str = '暂无'
			}
			return str;
		}
		function get_pile_by_number(pile){
			if(pile!==undefined &&pile !== null){
				let pile_number = Number(pile);
				pile_number = pile_number.toFixed(5);
				let pile_str = String(pile_number)
				let pile_str_arr = pile_str.split('.')
				let pile_part = pile_str_arr[1]||"0";
				let str = 'K'+pile_str_arr[0]+'+'+String((Number(pile_part)/100));
				return str;
			}else{
				return '暂无';
			}
		}
		function export_data(key,value,obj){
			obj.properties[key] = value;
		}
		function export_path_point(key,value,obj){
			obj.geometry.coordinates = value;
		}
		function get_load_read(key,obj){
			let value = obj.features[0].properties[key]
			if(value === undefined){
				value = road_data[key].read_default
			}
			if(value === '暂无'||value === ''){
				value = null;
			};
			return value;
		}
		function get_start_pos_read(key,obj){
			let pos = ""
			let value = obj.features[0].geometry.coordinates
			if(value){
				pos = value[0].join(',')
			}
			return pos;		
		}
		function get_end_pos_read(key,obj){
			let pos = ""
			let value = obj.features[0].geometry.coordinates
			if(value){
				pos = value[value.length-1].join(',')
			}
			return pos;		
		}
		function get_path_point_read(key,obj){
			let value = obj.features[0].geometry.coordinates
			if(value){
				return value;
			}else{
				return road_data[key].read_default;
			}
		}
		function number_compare(key,obj1,obj2){
			let str1 = "";
			let str2 = "";
			if(obj1[key]||obj1[key] === 0){
				str1 = obj1[key].replace(/\D/g, '');
			}
			if(obj2[key]||obj2[key] === 0){
				str2 = obj2[key].replace(/\D/g, '');	
			}
			let number_a = Number(str1)||0;
			let number_b = Number(str2)||0;
			return number_a - number_b;
		}
		function str_compare(key,obj1,obj2){
			return obj1[key].localeCompare(obj2[key]);
		}
		function road_part_id_compare(key,a,b){
			let a_road_part_id = a.road_part_id
			let b_road_part_id = b.road_part_id
			let a_part_id_arr = a_road_part_id.split('-')
			let a_part_id = a_part_id_arr[1]
			let b_part_id_arr = b_road_part_id.split('-')
			let b_part_id = b_part_id_arr[1]
			let number_a = Number(a_part_id)||0;
			let number_b = Number(b_part_id)||0;
			return number_a - number_b;
		}
		function get_filte_text(key){
			let key_id = 'filte_'+key+'_input'
			let dom = document.getElementById(key_id);
			if(dom){
				if(dom.value === '暂无'){
					return null;
				}else{
					return dom.value;
				}
			}
		}
		function set_filte_text(key,value){
			let key_id = 'filte_'+key+'_input'
			let dom = document.getElementById(key_id);
			if(dom){
				if(value == undefined ||value == null){
					value = "暂无";
				}
				dom.value = value;
			}
		}
		function filte_input(key,data,input_value){
			if(data[key] !== input_value){
				return false;
			}
			return true;
		}
		function filte_road_id_input(key,data,input_value){  //筛选函数
			if(input_value){
				let road_part_id = data['road_part_id'];
				let check_value = input_value+'-';
				if(!(road_part_id+'-').startsWith(check_value)){
					return false;
				}
			}
			return true;
		}
		function filte_checkbox(key,data,input_value){
			let menu_set = input_value;
			if(menu_set.size !== 0){
				if(data[key]&&!menu_set.has(data[key])){
					return false;
				}
			}
			return true;
		}
		function get_filte_arr(property){
			let result = get_filte_info();
			let filte_set = new Set();
			if(result.is_space){
				for(let [key,value] of line_map){
					let result = value[property]
					if(result !== ""&&result !== undefined&&result !== null){
						filte_set.add(result);
					}
				}
			}else{
				for(let [key,value] of line_map){
					if(check_filte(value,result)){
						let result = value[property]
						if(result!== ""&&result!== undefined&&result!== null){
							filte_set.add(result);
						}
					}
				}
			}
			let filte_arr = Array.from(filte_set);
			filte_arr.sort();
			return filte_arr;
		}
		function get_filte_info(){ //获取筛选界面的参数
			let input_arr = document.getElementById('filte_div').querySelectorAll('.filte_input');
			let checkbox_div_arr = document.getElementById('filte_div').querySelectorAll('.filte_checkbox_div');
			let select_arr = document.getElementById('filte_div').querySelectorAll('.filte_select');
			let filte_checkbox_obj = {};
			let filte_input_obj = {};	
			let is_space = true;
			let change_button_color = false;
			for(let checkbox_div of checkbox_div_arr){
				let menu_set = new Set();
				let key = checkbox_div.id.substring(6, checkbox_div.id.length - 4);
				let filte_check_arr = checkbox_div.querySelectorAll('.filte_checkbox');  
				for(let filte_check of filte_check_arr){
					if(filte_check.checked){
						menu_set.add(filte_check.dataset.value);
						is_space = false;
						change_button_color = true;
					}
				}
				filte_checkbox_obj[key] = menu_set;
			}
			for(let input of input_arr){
				let key = input.id.substring(6, input.id.length - 6);
				if(road_data[key]&&road_data[key].filte&&road_data[key].filte.read){
					let value = road_data[key].filte.read(key)
					if(value!==""){
						filte_input_obj[key] = road_data[key].filte.read(key);
						is_space = false;
						change_button_color = true;
					}
				}
			}
			for(let select of select_arr){
				let key = select.id.substring(6, select.id.length - 6);
				if(road_data[key]&&road_data[key].filte&&road_data[key].filte.read){
					let value = road_data[key].filte.read(key)
					if(value !== ''){
						filte_input_obj[key] = road_data[key].filte.read(key);
						is_space = false;
						if(key !== 'is_work'){
							change_button_color = true;
						}else if(select.value === '否'){
							change_button_color = true;
						}
					}
				}
			}
			if(change_button_color){
				document.getElementById('filte_button').classList.add('select');
			}else{
				document.getElementById('filte_button').classList.remove('select');
			}
			return {
				is_space:is_space,
				filte_checkbox_obj:filte_checkbox_obj,
				filte_input_obj:filte_input_obj
			}
		}
	</script>
	<script>
		function create_page(){
			let th_obj_arr = [];
			let check_filte_arr = [];
			let table_key_arr = [];	
			let road_info_arr = [];	
			let dropdown_arr = [];
			for(let key in road_data){
				if(road_data[key].table){
					if(road_data[key].table.width){
						road_data[key].table['key'] = key
						road_data[key].table['name'] = road_data[key].name;
						th_obj_arr.push(road_data[key].table)
					}
					if(road_data[key].table.sort){
						let sort_info = road_data[key].table.sort;
						sort_info['key'] = key
						check_filte_arr.push(sort_info)
					}
				}
			}
			th_obj_arr.sort((a, b) => a.index - b.index);
			for(let  obj of th_obj_arr){
				table_key_arr.push(obj['key'])
			}
			let table1thead = document.getElementById('table1thead');
			let table1thead_tr = document.createElement('tr');
			for(let th_obj of th_obj_arr){
				let th = document.createElement('th');
				th.className = 'table1th';
				th.id = 'table_'+th_obj['key']+'_th';
				th.style.width = th_obj.width;
				th.textContent = th_obj['name'];
				table1thead_tr.appendChild(th);
			}

			table1thead_tr.appendChild(create_all_check_cell());
			table1thead.appendChild(table1thead_tr)
			check_filte_arr.sort((a, b) => a.index - b.index);
			for(let key in road_data){
				let info_display = road_data[key].info_display
				if(road_data[key].info_display){
					info_display['key'] = key;
					info_display['name'] = road_data[key].name;
					road_info_arr.push(road_data[key].info_display)
				}
				if(road_data[key].filte&&road_data[key].filte.type === 'input'&&road_data[key].filte.dropdown){
					dropdown_arr.push(key)
				}
			}
			road_info_arr.sort((a, b) => a.index - b.index);
			let roda_info_temp_div = document.createDocumentFragment();
			for(let obj of road_info_arr){
				let div = document.createElement('div');
				div.textContent = obj.name+':';
				let span = document.createElement('span');
				span.className = 'road_info_cell';
				span.id = 'read_'+obj['key'];
				div.appendChild(span);
				roda_info_temp_div.appendChild(div);
			}
			document.getElementById('road_info').appendChild(roda_info_temp_div);
			for(let key of dropdown_arr){
				let key_id = 'filte_'+key+'_div'
				let div = document.getElementById(key_id)
				if(div){
					let dropdown_menu = document.createElement('div');
					dropdown_menu.className = 'dropdown';
					dropdown_menu.id = 'filte_'+key+'_dropdown'
					let item_div = document.createElement('div');
					item_div.className = 'dropdown_item_div'
					item_div.id = 'filte_'+key+'_item_div'
					dropdown_menu.appendChild(item_div);
					div.appendChild(dropdown_menu);
				}
			}
			return {check_filte_arr:check_filte_arr,table_key_arr:table_key_arr};
		}
		async function start(adcode,adcode_lng,adcode_lat){
			// ----------初始化地图START----------
			if (typeof AMap === 'undefined') {
				await alert_fix('高德api的key设置参数错误');
				open_key_save_win();
				return;
			}
			let basic_lay = new AMap.createDefaultLayer({zIndex: 2}); //基础图层
			let photo_lay = new AMap.TileLayer.Satellite({zIndex: 3,visible:false}); //卫星图层
			let city_part_lay = new AMap.DistrictLayer.Province({
			  zIndex: 4, //设置图层层级
			  adcode: adcode, //设置行政区 adcode
			  depth: 2, //设置数据显示层级，0：显示国家面，1：显示省级，当国家为中国时设置depth为2的可以显示市一级
			}); //行政图层（用于显示城市的范围）
			
			let road_lay = new AMap.TileLayer.RoadNet({zIndex:5}); //路网图层
			city_part_lay.setStyles({
			  "stroke-width": 2, //描边线宽
			  fill:[100,100,0,0.1],
			});		
			map = new AMap.Map('map_div', {
				zoom: 12,
				center: [adcode_lng, adcode_lat],
				layers: [basic_lay,photo_lay,city_part_lay,road_lay], 
				viewMode: '2D',
				  WebGLParams: {
					preserveDrawingBuffer: true // 关键：保留缓冲区供读取
				  }
			});	
			map.on('click', async function(e) {	
				if(state.lock){
					await alert_fix('其他操作进行中，请稍后');
					return;
				}
				let lng = e.lnglat.getLng();
				let lat = e.lnglat.getLat();
				if(state.is_draw_route){
					if(state.is_drag_mode){
						if(!draw_line_obj.line){
							draw_line_obj.check_point.push([lng,lat]);
							await create_drag_line_by_check_point(draw_line_obj['check_point']);
							if(!draw_line_obj.line){
								add_click_mark(lng,lat);
							}else{
								if(click_icon){
									map.remove(click_icon);
									click_icon.destroy();
									click_icon = null;
								}
							}
						}
					}else{
						add_click_mark(lng,lat);
						await updata_draw_line_obj(lng,lat)	
					}
				}else{
					add_click_mark(lng,lat);
				}
				cance_select_line();
			});		
			// ----------初始化地图END----------		
			await load_plugin("AMap.ToolBar")
			await load_plugin("AMap.Scale")
			await load_plugin("AMap.Geolocation")
			await load_plugin("AMap.PlaceSearch")
			//构造路线导航类
			await load_plugin("AMap.DragRoute")
			await load_plugin("AMap.Driving")
			await load_plugin("AMap.DragRoute")
			await load_plugin("AMap.RangingTool")
			await load_plugin("AMap.MouseTool",)
			let toolbar = new AMap.ToolBar(
				{
					position: {
					  top: '220px',
					  left: '20px',
					  
					}
				}			
			);
			let Scale = new AMap.Scale(
				{
					position: {
					  top: '20px',
					  left: '150px',
					  
					}
				}
			);	
			let geolocation = new AMap.Geolocation({
				enableHighAccuracy: true,//是否使用高精度定位，默认:true
				position: {
				  top: '170px',
				  left: '20px',
				},    //定位按钮的停靠位置
				zoomToAccuracy: true,   //定位成功后是否自动调整地图视野到定位点

			});	
			placeSearch = new AMap.PlaceSearch({
			  city: adcode,
			  pageSize: 10, 
			  map:map
			});		
			Ranging = new AMap.RangingTool(map);
			mouseTool = new AMap.MouseTool(map);
			
			map.addControl(toolbar);
			map.addControl(Scale);
			map.addControl(geolocation);		
		  // 绑定事件监听
			document.getElementById('search_input').addEventListener('keydown', function(event) {
				if (event.key === 'Enter') {
					event.preventDefault(); // 阻止默认行为（如页面刷新）
					let key_word = document.getElementById('search_input').value;
					document.getElementById('search_result_div').dataset.key_word = key_word
					get_seach_menu(key_word,1);
				}
			});
			document.getElementById('file_input').addEventListener('change', async function(e){
				let files = e.target.files
				let has_json_file = false;
				let data_count = 0
				for (let i = 0; i < files.length; i++) {
					if (files[i].name.toLowerCase().endsWith('.json')) {
						has_json_file = true;
						break;
					}
				}
				if(has_json_file){
					let isConfirmed = await confirm_fix("JSON格式数据会覆盖相同路段识别码的数据，是否继续?");
					if(!isConfirmed){
						document.getElementById('file_input').value = null;
						return;
					};
				}
				for(let i = 0;i<files.length;i++){
					let file = files[i]
					const text_content = await readFileAsText(file); // 异步读取文件
					if(!text_content){
						document.getElementById('file_input').value = null;
						return;
					}
					if(file.name.toLowerCase().endsWith('.json')) {
						try{
							let content = JSON.parse(text_content);
							if(Array.isArray(content)){
								for(let load_obj of content){
									load_line_data(load_obj)
								}
								data_count = data_count+content.length
							}else{
								load_line_data(content);
								data_count++;
							}
						}catch(err){
							await alert_fix('JSON解析失败');
							document.getElementById('file_input').value = null;
							return;
						}
					}else if(file.name.toLowerCase().endsWith('.txt')){
						let data_arr = load_data_by_table(text_content);
						data_count = data_count+data_arr.length;
					}
					let filte_map = get_filte_map();
					updata_table(filte_map);
				}
				await creat_auto_destroy_info('共加载'+String(data_count)+'条数据',2500);
				document.getElementById('file_input').value = null;
			});	
			document.getElementById('get_map_color_select').addEventListener('change', function(){
				setting_map_color_menu()
			});			
			document.getElementById('export_type').addEventListener('change',create_checkbox_div)
			document.getElementById('main_div').addEventListener('click', async function(event){
				close_opening_menu(open_menu_set);
				const target = event.target;
				if( target.id === 'road_face_area_input'){
					if(!document.getElementById('road_face_area_input').value&&document.getElementById('road_long_input')&&document.getElementById('road_face_width_input')){
						let road_long = document.getElementById('road_long_input').value
						let road_width = document.getElementById('road_face_width_input').value
						let area = Number(road_long)*Number(road_width)
						if(area){
							document.getElementById('road_face_area_input').value = area
						}
					}
				
				}else if(target.id === 'search_button'){
					  let key_word = document.getElementById('search_input').value;
					  document.getElementById('search_result_div').dataset.key_word = key_word;
					  get_seach_menu(key_word,1);
				}else if(target.id === 'search_clear_button'){
					document.getElementById('search_result_div').classList.remove('expanded'); 
					document.getElementById('search_input').value = '';
					document.getElementById('item_div').innerHTML = '';
					document.getElementById('search_result_div').removeAttribute('key_word');
					placeSearch.clear();
				}else if(target.id === 'back_page'){
					let total_page = Number(document.getElementById('total_page_div').textContent)||1;
					let page_index = Number(document.getElementById('page_index_div').textContent)||1;
					let key_word = document.getElementById('search_result_div').dataset.key_word||"";
					if(page_index>1){
						page_index = page_index-1
						get_seach_menu(key_word,page_index)
					}else if(page_index!== 1){
						get_seach_menu(key_word,1)
					}
				}else if(target.id === 'forward_page'){
					let total_page = Number(document.getElementById('total_page_div').textContent)||1;
					let page_index = Number(document.getElementById('page_index_div').textContent)||1;
					let key_word = document.getElementById('search_result_div').dataset.key_word||"";
					if(page_index<total_page){
						page_index++
						get_seach_menu(key_word,page_index)
					}else if(page_index !== total_page){
						get_seach_menu(key_word,total_page)
					}
				}else if(event.target.closest('#page_info')){
					let total_page = Number(document.getElementById('total_page_div').textContent)||1;
					let page_index_str = document.getElementById('page_index_div').textContent; 
					let page_index = Number(await prompt_fix("请输入页码：",page_index_str))||1;
					let key_word = document.getElementById('search_result_div').dataset.key_word||"";
					if(page_index>0&&page_index<=total_page){
						get_seach_menu(key_word,page_index);
					}else if(page_index<1){
						get_seach_menu(key_word,1);
					}else if(page_index>total_page){
						get_seach_menu(key_word,total_page);
					}
				}else if(event.target.closest('#item_div')){
					let select = event.target.closest('.dropdown-item')
					let lnglat = select.dataset.location.split(',');
					 map.setZoom(20);
					 map.setCenter(lnglat);
				}else if(target.id === 'basic_lay_check'){
					if(document.getElementById('basic_lay_check').checked){
						basic_lay.show();
					}else{
						basic_lay.hide();
					}
				}else if(target.id === 'photo_lay_check'){
					if(document.getElementById('photo_lay_check').checked){
						photo_lay.show();
					}else{
						photo_lay.hide();
					}
				}else if(target.id === 'city_part_lay_check'){
					if(document.getElementById('city_part_lay_check').checked){
						city_part_lay.show();
					}else{
						city_part_lay.hide();
					}
				}else if(target.id === 'road_lay_check'){
					if(document.getElementById('road_lay_check').checked){
						road_lay.show();
					}else{
						road_lay.hide();
					}
				}else if(target.id === 'fly_mode_button'){
					if (fly_mode_menu.classList.contains('expanded')) {
						fly_mode_menu.classList.remove('expanded');
						document.getElementById('fly_mode_button').textContent = '绘制无人机服务区域 ▼'
					} else {
						fly_mode_menu.classList.add('expanded');
						document.getElementById('fly_mode_button').textContent = '绘制无人机服务区域 ▲'
					}
				}else if(target.id === 'hide_table_button'){
					if(hide_table_button.textContent === '隐藏表格'){
						document.getElementById('hide_table_div').style.display = 'none';
						document.getElementById('edit_table_button_div').style.display = 'none';
						hide_table_button.textContent = '显示表格'
					}else{
						hide_table_button.textContent = '隐藏表格'
						document.getElementById('hide_table_div').style.display = 'flex';
						document.getElementById('edit_table_button_div').style.display = 'flex';
					}
				}else if(target.id === 'filte_button'){
					modal_work(1,'filte_div');
				}else if (target.id === 'filte_confirmButton'){
					modal_work(0);
					let filte_map = get_filte_map();
					updata_table(filte_map);
					await creat_auto_destroy_info('共'+String(filte_map.size)+'条数据',2500);
				}else if(target.id === 'filte_canceButton'){
					modal_work(0);
				}else if(event.target.closest('.filte_input')){
					let target_id = event.target.closest('.filte_input').id;
					let key = target_id.substring(6, target_id.length - 6);
					click_filte_input(key)
				}else if(event.target.closest('.dropdown_item_div')){
					let target_id = event.target.closest('.dropdown_item_div').id;
					let key = target_id.substring(6, target_id.length - 9);
					let select = event.target.closest('.dropdown-item');
					if(select){
						if(road_data[key].filte&&road_data[key].filte.write){
							road_data[key].filte.write(key,select.dataset.value)
						}
					}
				}else if(event.target.id == 'all_check'){
					let checkboxes = document.getElementById('table1body').querySelectorAll('.row-check');
					for(let checkbox of checkboxes){
						checkbox.checked = document.getElementById('all_check').checked;
						if(checkbox.checked){
							select_set.add(checkbox.closest('.tabletr').dataset.id)
						}else{
							select_set.delete(checkbox.closest('.tabletr').dataset.id)
						}
					}
				}else if(target.id ==='hide_select_line_button'){
					if(!select_line_id){
						return;
					};
					let line_obj = line_map.get(select_line_id);
					if(!line_obj){
						return;
					};
					let display = line_obj.display;
					if(display){
						document.getElementById('hide_select_line_button').textContent = '显示路线';
						if(line_obj.line){
							line_obj.line.hide();
						}
						if(line_obj.start_mark){
							line_obj.start_mark.hide();
						}
						if(line_obj.end_mark){
							line_obj.end_mark.hide();
						}
						line_obj.display = false;
					}else{
						document.getElementById('hide_select_line_button').textContent = '隐藏路线';
						if(line_obj.line){
							line_obj.line.show();
						}
						if(line_obj.start_mark){
							line_obj.start_mark.show();
						}
						if(line_obj.end_mark){
							line_obj.end_mark.show();
						}
						line_obj.display = true;					
					}
				
				}else if(target.id === 'detail_page_button'){
					clear_detail_cell();
					if(select_line_id){
						let line_obj = line_map.get(select_line_id);
						if(!line_obj){
							return;
						}
						for(let key in road_data){
							let key_id = key+'_detail_page'
							let dom = document.getElementById(key_id)
							if(dom){
								if(road_data[key].display_str){
									let str = road_data[key].display_str(key,line_obj)
									dom.textContent = str
								}else{
									dom.textContent = "";
								}
							}
						}
					
					}
					modal_work(1,'detail_table_div');
				}else if(target.id ==='draw_route_button'){
					let button_mode = document.getElementById('draw_route_button').dataset.mode;
					if(button_mode === 'none'){
						modal_work(1,'table_div');
					}else if(button_mode === 'select'){
						let road_part_id = select_line_id;
						await edit_select_line(road_part_id)
					}else if(button_mode === 'edit'){
						await close_edit_menu();
					}
				}else if(target.id ==='drag_mode_buton'){ //拖拽模式
					let button_mode = drag_mode_buton.dataset.mode;
					if(state.lock){
						return;
					}
					if(button_mode === 'off'){
						drag_mode_on() //打开拖拽模式
						await create_drag_line_by_check_point(draw_line_obj['check_point'])
					}else if(button_mode === 'on'){
						drag_mode_off() //关闭拖拽模式
						let new_line_obj = draw_line_by_path_point(draw_line_obj['path_point']);
						let path_point = draw_line_obj['path_point'];
						let start_pos = "";
						let end_pos = "";
						if(path_point[0]){
							start_pos = path_point[0].join(',');
						}
						if(path_point[path_point.length-1]&&path_point.length>1){
							end_pos = path_point[path_point.length-1].join(',');
						}
						if(new_line_obj){
							draw_line_obj['start_mark'] = new_line_obj.start_mark;
							draw_line_obj['end_mark'] = new_line_obj.end_mark;
							draw_line_obj['distance'] = Math.round(AMap.GeometryUtil.distanceOfLine(draw_line_obj['path_point']));
							draw_line_obj['line'] = new_line_obj.line;
						}
					}
				}else if(target.id === 'delete_line_button'){
					await delete_select_line()
				}else if(target.id === 'export_line_button'){
					//export_select_line()
					modal_work(1,'export_table_div')
					create_checkbox_div();
				}else if(target.id === 'export_confirmButton'){
					await export_select_line()
				}else if(target.id === 'get_pile_button'){
					if(state.is_pile_mode){
						state.is_pile_mode = false;
						document.getElementById('get_pile_button').classList.remove('select');
					}else{
						document.getElementById('get_pile_button').classList.add('select');
						state.is_pile_mode = true;
					}
				}else if(target.id === 'hide_line_button'){
					hide_select_line()
				}else if(target.id === 'display_line_button'){
					display_select_line()
				}else if(target.id === 'edit_line_button'){
					if(select_set.size == 0){
						return;
					}
					if(select_set.size !== 1 ){
						await alert_fix('仅允许同时编辑1条路段');
						return;
					}
					let road_part_id = select_set.values().next().value;
					await edit_select_line(road_part_id)
				}else if(event.target.closest('.tabletr')){
					if(event.target.closest('.select_td')){
						if(event.target.className === 'row-check'){
							if(event.target.checked){
								select_set.add(event.target.closest('.tabletr').dataset.id)
							}else{
								select_set.delete(event.target.closest('.tabletr').dataset.id)
							}
						}
					}else{
						let tabletr = event.target.closest('.tabletr');
						let road_part_id = tabletr.dataset.id;
						select_line(road_part_id,1)				
					}
				}else if (target.id === 'confirmButton'){
					await input_confirm();
				}else if(target.id === 'canceButton'||target.id === 'close_icon'){
					modal_work(0);
				}else if(target.id === 'change_info_button'){
					modal_work(1,'table_div');
				}else if (target.id === 'get_map_confirmButton') {
					let x_min_str = document.getElementById('get_map_x_min_input').value
					let x_max_str = document.getElementById('get_map_x_max_input').value
					let y_min_str = document.getElementById('get_map_y_min_input').value
					let y_max_str = document.getElementById('get_map_y_max_input').value
					if(!x_min_str||!x_max_str||!y_min_str||!y_max_str){
						await alert_fix('范围不能为空');
						return;
					}
					let x_min = Number(x_min_str);
					let x_max = Number(x_max_str);
					let y_min = Number(y_min_str);
					let y_max = Number(y_max_str);			
					modal_work(0,'get_map_table_div');
					await get_map_by_lng_lat(x_min,x_max,y_min,y_max)
				}else if (target.id === 'get_map_drawButton') {
					modal_work(0,'get_map_table_div');
					await get_map_area();
				}else if (target.id === 'map_out_button') {
					modal_work(1,'get_map_table_div');
				}else if (target.id === 'get_distance_button'){
					let get_distance_button = document.getElementById('get_distance_button');
					let mod = document.getElementById('get_distance_button').dataset.mode;
					if(mod === 'off'){
						get_distance_on()
					}else{
						get_distance_off()
					}
				}else if (target.id === 'draw_circle_button') {
					await drawCircle();
				} else if (target.id === 'clear_circle_mark_button') {
					clear_circle_mark();
				}else if(target.id === 'clear_draw_mark'){
					clear_mark(['start_mark','end_mark','line','route','distance','path_point','check_point'],1);
				}else if(target.id ==='back_route_button'){
					await back_draw()
				}else if(target.id ==='export_route_button'||target.id ==='save_route_button'){
					let line = draw_line_obj.line;
					if(!line){
						await alert_fix('无路线实例信息')
						return;
					}
					let line_all_info_obj = create_all_info_obj(line);
					if(target.id ==='export_route_button'){
						let export_obj = export_geojson(line_all_info_obj,'GCJ02');
						let json_string = JSON.stringify(export_obj);
						let road_part_id = export_obj.features[0].properties.road_part_id;
						let road_name = export_obj.features[0].properties.road_name||"";
						let filename = road_part_id+'-'+road_name+'.json';
						if(!road_part_id&&!road_name){
							filename = '路径数据.json'
						};
						downloadTextAsFile(json_string,filename)
					}else{
						save_line_to_table(line_all_info_obj);
					}
				}else if(target.id ==='add_coordinates_button'){
					let pos = await prompt_fix("输入坐标(例如:116.397428,39.90923)");
					if(!pos){
						return;
					}
					if (!/^\s*[\d.]+,\s*[\d.]+\s*$/.test(pos)) {
						await alert_fix("格式错误！示例：116.397428,39.90923");
						return;
					}
					let pos_arr = pos.split(',').map(item => item.trim());
					if (pos_arr.length !== 2 || isNaN(pos_arr[0]) || isNaN(pos_arr[1])) {
						await alert_fix("必须输入两个有效数字！");
						return;
					}
					let lng = pos_arr[0];
					let lat = pos_arr[1];
					add_click_mark(lng,lat)
					await updata_draw_line_obj(lng,lat)
					map.setCenter([Number(lng), Number(lat)]);
				}else if( target.id ==='load_line_button'){
					document.getElementById('file_input').click();
				}else if(target.id ==='key_manage_button'){
					open_key_save_win();
				}
			});	
		}
		function load_plugin(pluginName) {
			return new Promise((resolve, reject) => {
				AMap.plugin(pluginName, () => resolve());
			});
		}
		function readFileAsText(file) {
			return new Promise((resolve, reject) => {
				let reader = new FileReader();
				reader.onload = (e) => resolve(e.target.result); 
				reader.onerror = (e) => reject(new Error('文件读取错误'));
				reader.readAsText(file); // 以文本格式读取文件
			});
		}
		async function create_drag_line_by_check_point(check_point){
			if (check_point.length < 2) {
				return;
			}
			clear_mark(['start_mark','end_mark','line','path_point','route','distance'],0);
			return new Promise((resolve, reject) => {						
				let drog_line = new AMap.DragRoute(map,check_point,AMap.DrivingPolicy.LEAST_DISTANCE);
				drog_line.on('complete', async (result) => {
					if(result.data.info == 'OK'){
						get_drog_line_info(result,drog_line)					
						resolve(drog_line);
					}else{
						await alert_fix('路径规划出错，最多支持16个途径点')
						resolve();
					}
				});
				drog_line.on('error', (error) => {
					reject(new Error(`路径规划失败: ${error.info || "未知错误"}`));
				});
				// 开始路径规划
				draw_line_obj['line'] = drog_line;
				drog_line.search();
			});
		};
		function get_drog_line_info(result,drog_line){
			let path_point = [];
			let path_point_obj_arr = drog_line.getRoute();
			let distance = 0;
			for(let obj of path_point_obj_arr){
				path_point.push([obj.lng,obj.lat])
			}
			let route = result.data.routes[0];
			let check_point_arr = drog_line.getWays( );
			let check_point = [];
			check_point.push([result.data.start.location.lng,result.data.start.location.lat]);
			for(let obj of check_point_arr){
				check_point.push([obj.lng,obj.lat])
			}
			check_point.push([result.data.end.location.lng,result.data.end.location.lat]);
			draw_line_obj['path_point'] = path_point;
			draw_line_obj['check_point'] = check_point;
			draw_line_obj['route'] = route;
			draw_line_obj['distance'] = route.distance;
			draw_line_obj['start_mark'] = null;
			draw_line_obj['end_mark'] = null;
			let start_pos = "";
			let end_pos = "";
			if(path_point[0]){
				start_pos = path_point[0].join(',');
			}
			if(path_point[path_point.length-1]&&path_point.length>1){
				end_pos = path_point[path_point.length-1].join(',');
			};
			if(route.distance){
				distance = Number(route.distance);
			}else{
				distance = Math.round(AMap.GeometryUtil.distanceOfLine(path_point));
			}
			let obj = {
				start_pos:start_pos,
				end_pos:end_pos,
				distance:distance,
			}
			display_road_info(obj);
		};
		function get_distance_on(){
			document.getElementById('get_distance_button').dataset.mode = 'on'
			document.getElementById('get_distance_button').classList.add('select');
			if(Ranging){
				Ranging.turnOn();
			}
		}
		function get_distance_off(){
			document.getElementById('get_distance_button').dataset.mode = 'off';
			document.getElementById('get_distance_button').classList.remove('select');
			if(Ranging){
				Ranging.turnOff();
			}
		}
		async function convertToGCJ02(gps) { //通过高德api转换gps坐标系为火星坐标系
			return new Promise((resolve, reject) => {
				AMap.convertFrom(gps, "gps", function (status, result) {
					if (status === "complete" && result.info === "ok") {
						const lnglats = result.locations;
						resolve(lnglats); // 成功时返回结果
					} else {
						reject(new Error(`坐标转换失败: ${result.info}`)); // 失败时抛出错误
					}
				});
			});
		}
		async function drawCircle(){ //无人机服务器绘制函数
			// 获取用户输入
			if(document.getElementById('gpslng_input').value&&document.getElementById('gpslat_input').value){
				let gpslng = document.getElementById('gpslng_input').value
				let gpslat = document.getElementById('gpslat_input').value
				let gps = [gpslng,gpslat]
				let result = await convertToGCJ02(gps)
				document.getElementById('lng_input').value = result[0].lng;
				document.getElementById('lat_input').value = result[0].lat;
			}
			let lng = parseFloat(document.getElementById('lng_input').value);
			let lat = parseFloat(document.getElementById('lat_input').value);			


			let radius = parseInt(document.getElementById('radius_input').value);
			// 验证输入有效性
			if (isNaN(lng) || isNaN(lat) || isNaN(radius)) {
				await alert_fix('请输入有效的坐标和半径值！');
				return;
			}
			// 创建新圆形
			let currentCircle_area = new AMap.Circle({
				center: [lng, lat],
				radius: radius,
				strokeColor: "#FF33FF",
				strokeOpacity: 0.8,
				strokeWeight: 0,
				fillColor: "#87ceef",
				fillOpacity: 0.4,
				zIndex: 10,
				bubble: true
			});
			let currentCircle_center = new AMap.Marker({
				position: [lng,lat], // 圆心位置
				icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_r.png", // 蓝色标记图标
				offset: new AMap.Pixel(-13, -30), // 图标偏移量，使图标底部对准圆心
				zIndex: 11 // 确保标记显示在圆形上方
			});
			let obj = {
					area:currentCircle_area,
					center:currentCircle_center
				}
				obj.area.setMap(map);
				obj.center.setMap(map);
			
			// 调整地图视野以完整显示圆形 
			map.setFitView([obj.area, obj.center]);
			circle_obj_arr.push(obj);
		}
		function select_line(road_part_id,mode){
			if(!road_part_id){
				return;
			}
			if(state.is_draw_route){
				return;
			};
			let obj = line_map.get(road_part_id);
			if(!obj){
				return;
			}
			let line = obj.line;
			let select_line_obj = line_map.get(select_line_id)
			if(select_line_obj){
				let select_line = select_line_obj.line;
				if(select_line_obj.display){
					select_line_obj.start_mark.show();
					select_line_obj.end_mark.show();
					select_line.show();
				}else{
					select_line_obj.start_mark.hide();
					select_line_obj.end_mark.hide();
					select_line.hide();
				}
			}
			select_line_change_color(road_part_id);
			if(obj.display){
				document.getElementById('hide_select_line_button').textContent= '隐藏路线'
			}else{
				document.getElementById('hide_select_line_button').textContent= '显示路线'
			}
			obj.line.show();
			obj.start_mark.show();
			obj.end_mark.show();
			display_road_info(obj);
			if(mode){
				map.setFitView(line);
			}
		}		
		function cance_select_line(){ //取消（地图选择）选中路线
			if(select_line_id){
				let select_line_obj = line_map.get(select_line_id)
				if(select_line_obj){
					let line = select_line_obj.line;
					line.setOptions({strokeColor: gaode.basic_line_color,zIndex:13});
					let start_mark = select_line_obj.start_mark;
					let end_mark = select_line_obj.end_mark;
					start_mark.setOptions({zIndex:14});
					end_mark.setOptions({zIndex:15});
					if(state.is_draw_route){
						line.hide();
						start_mark.hide();
						end_mark.hide();
					}else{
						if(select_line_obj.display){
							start_mark.show();
							end_mark.show();
							line.show();
						}else{
							start_mark.hide();
							end_mark.hide();
							line.hide();
						};
					}
				}
				select_line_id = "";
				let button_mode = document.getElementById('draw_route_button').dataset.mode;
				display_road_info()
				if(button_mode === 'select'){
					document.getElementById('draw_route_button').textContent = '新增路线';
					document.getElementById('draw_route_button').dataset.mode = 'none';
				}
			}
		}		
		async function delete_select_line(){ //删除选中的路线
			if(select_set.size === 0){
				return;
			}
			let isConfirmed = await confirm_fix("是否删除?");
			if(!isConfirmed){
				return;
			};
			cance_select_line();
			for(let select of select_set){
				let obj = line_map.get(select)
				map.remove(obj.start_mark)
				map.remove(obj.end_mark)
				map.remove(obj.line)
				
				obj.start_mark.destroy();
				obj.end_mark.destroy();
				obj.line.destroy();
				line_map.delete(select);
				table_line_set.delete(select);
				if(select === select_line_id){
					select_line_id = "";
				};
			}
			let tabletr_arr = document.getElementById('table1body').querySelectorAll('.tabletr');
			for(let tabletr of tabletr_arr){
				if(select_set.has(tabletr.dataset.id)){
					document.getElementById('table1body').removeChild(tabletr);
				}
			}
			select_set.clear();
			await alert_fix("选中路线已删除！")
		}
		function get_export_info(){
			let export_checkbox_div = document.getElementById('export_checkbox_div');
			let checkbox_arr = export_checkbox_div.querySelectorAll('.export_checkbox');
			let key_set = new Set();
			key_set.add('road_part_id');
			for(let checkbox of checkbox_arr){
				if(checkbox.checked){
					key_set.add(checkbox.dataset.key)
				}
			}
			let export_type = document.getElementById('export_type').value
			let obj = {
					export_type:export_type,
					key_set:key_set
				}
			return obj;
		}
		async function export_select_line(){ //导出选中（表格）路线
			modal_work(0);
			let export_arr = [];
			let info_obj = get_export_info()
			let key_set = info_obj.key_set;
			let export_type = info_obj.export_type;
			if(export_type === 'JSON'){
				for(let select of select_set){
					let obj = line_map.get(select);
					export_arr.push(obj);
				};
				let json_string =""
				let filename = '路径数据.geojson'
				if(export_arr.length){
					let export_obj = export_geojson(export_arr,'GCJ02');
					json_string = JSON.stringify(export_obj);
				}else{
					return;
				}
				downloadTextAsFile(json_string,filename);
			}else if(export_type === 'JSONGPS'){
				let check_point_arr = [];
				let path_point_arr = [];
				for(let select of select_set){
					let obj = line_map.get(select);
					let check_point = [];
					if(obj.check_point){
						for(let point of obj.check_point){
							let gps = coordtransform.gcj02towgs84(point[0],point[1]);
							check_point.push(gps)
						}
					}
					let path_point = [];
					if(obj.path_point){
						for(let point of obj.path_point){
							let gps = coordtransform.gcj02towgs84(point[0],point[1]);
							path_point.push(gps)
						}
					}
					check_point_arr.push(check_point);
					path_point_arr.push(path_point);
					export_arr.push(obj);
				};
				let json_string =""
				let filename = '路径数据.geojson'
				if(export_arr.length){
					let export_obj = export_geojson(export_arr,'WGS84');
					for(let i= 0;i<export_obj.features.length;i++){
						export_obj.features[i].properties.check_point = check_point_arr[i]
						export_obj.features[i].geometry.coordinates = path_point_arr[i]
						export_obj.features[i].properties.name = '['+export_obj.features[i].properties.road_part_id+']'+export_obj.features[i].properties.road_name
					}
					json_string = JSON.stringify(export_obj);
				}else{
					return;
				}				
				downloadTextAsFile(json_string,filename);
			}else if(export_type === 'TXT'){
				let vision = ""
				let content = "版本:\t"+vision+"\r\n"
				key_arr = Array.from(key_set);
				let table_head_arr = []
				for(let key of key_arr){
					table_head_arr.push(road_data[key].name)
				}
				content = content+table_head_arr.join('\t')+'\r\n'
				for(let select of select_set){
					let obj = line_map.get(select);
					let cell_arr = []
					for(let key of key_arr){
						let str = "";
						if(obj[key]=== null||obj[key]=== undefined){
							str = "";
						}else{
							str = String(obj[key])
						}
						cell_arr.push(str)
					}
					let tr_str = cell_arr.join('\t');
					content = content+tr_str+'\r\n'
				};
				downloadTextAsFile(content,'路线巡查表.txt');
			}else if(export_type === 'XLSX'){
				key_arr = Array.from(key_set);
				let cell_arr = []
				let width_arr = [];
				let height_arr = [];
				let style_arr = [];
				let style_obj = {
					numFmtId: 0,      // 数字格式ID
					fontId: 0,        // 字体ID
					fillId: 0,        // 填充ID
					borderId: 0,      // 边框ID
					xfId: 0,          // 基础样式ID
					applyAlignment: 1, // 是否应用对齐 (0/1)
					horizontal: "center",  // left/center/right
					vertical: "center"     // top/center/bottom
				}
				style_arr.push(style_obj)
				for(let i = 0;i<key_arr.length;i++){
					let key = key_arr[i];
					if(key ==='road_map'){
						cell_arr.push({type:'text',content:'地图',pos:[[i+1,1]],style:1})
						width_arr.push(40);
					}else if(road_data[key]&&road_data[key].name){
						cell_arr.push({type:'text',content:road_data[key].name,pos:[[i+1,1]],style:1})
						width_arr.push(40);
					}
				}
				height_arr.push(20);
				for(let select of table_line_set){
					let obj = line_map.get(select)
					if(obj){
						if(obj.line){
							obj.line.hide();
						}
						if(obj.start_mark){
							obj.start_mark.hide();
						}
						if(obj.end_mark){
							obj.end_mark.hide();
						}
					}
				};
				let select_arr = Array.from(select_set)
				for(let i = 0 ;i<select_arr.length;i++){
					let select = select_arr[i]
					let obj = line_map.get(select);
					for(let j = 0;j<key_arr.length;j++){
						let key = key_arr[j];
						if(key === 'road_map'){
							obj.line.show();
							await Promise.all([wait_move_end(),new Promise((resolve) => {map.setFitView(obj.line);resolve()})]);
							let wait_time = Number(document.getElementById('get_map_wait_time_input').value);
							await delay(wait_time);
							let blob = await get_picture()
							cell_arr.push({type:'picture',content:obj.road_part_id,blob:blob,pos:[[j+1,i+2]],style:1})
							obj.line.hide();
						
						}else if(obj[key]=== null||obj[key]=== undefined){
							str = "";
							cell_arr.push({type:'text',content:str,pos:[[j+1,i+2]],style:1})
						}else{
							str = String(obj[key])
							cell_arr.push({type:'text',content:str,pos:[[j+1,i+2]],style:1})
						}

					}
					height_arr.push(100);
				};
				for(let select of table_line_set){
					let obj = line_map.get(select);
					if(obj&&obj.display){
						if(obj.line){
							obj.line.show();
						}
						if(obj.start_mark){
							obj.start_mark.show();
						}
						if(obj.end_mark){
							obj.end_mark.show();
						}
					}
				};
				await get_xlsx(cell_arr,width_arr,height_arr,style_arr,'路线表.xlsx')
			}
		}
		function get_pile(path_point,pos,start,end){
			if (path_point.length < 2) {
				return 0;
			}
			if(start===null||end===null||start===undefined||end===undefined){
				return null;
			}
			let md = null; 
			let md_index = 0;
			for (let i = 0; i < path_point.length - 1; i++) {
				const p1 = path_point[i];
				const p2 = path_point[i + 1];
				const d = AMap.GeometryUtil.distanceToSegment(pos, p1, p2);
				if(i === 0){
					md = d;
					md_index = 0;
				}else if(d < md) {
					md = d;
					md_index = i;
				}
			}
			let p1 = path_point[md_index];
			let p2 = path_point[md_index+1];
			let sd = AMap.GeometryUtil.distance(p1,pos)
			let ed = AMap.GeometryUtil.distance(p2,pos)
			let ld = AMap.GeometryUtil.distance(p1,p2)
			let part_line_long = 0;
			
			if(sd*sd-md*md>ld*ld||ed*ed-md*md>ld*ld){
				if(sd<ed){
					part_line_long = 0
				}else{
					part_line_long = ld
				}
			}else{
				part_line_long = Math.sqrt(sd*sd-md*md)
			}
			let part_line_path_point = [];
			for(i = 0;i<=md_index;i++){
				part_line_path_point.push(path_point[i])
			}
			let l1 = 0;
			if(part_line_path_point.length>=2){
				l1 = AMap.GeometryUtil.distanceOfLine(part_line_path_point)
			}
			let total_line = AMap.GeometryUtil.distanceOfLine(path_point)
			l1 = l1+part_line_long;
			let pro = l1/total_line
			let pile = (start+((end-start)*pro)).toFixed(3);
			return Number(pile);
		}
		function hide_select_line(){ //隐藏选中路段
			for(let select of select_set){
				let obj = line_map.get(select)
				hide_line(obj,true);
				obj.display = false;
			}
			let button_mode = document.getElementById('draw_route_button').dataset.mode;
			if(button_mode === 'select'){
				document.getElementById('draw_route_button').textContent === '新增路线';
				document.getElementById('draw_route_button').dataset.mode = 'none';
			}
		}
		function hide_line(obj,mode){//隐藏选中路段根据id
			if(!obj){
				return;
			}
			if(select_line_id === obj.road_part_id){
				cance_select_line()
			}
			obj.line.hide();
			let road_part_id = obj.road_part_id
			if(road_part_id&&road_part_id === select_line_id){
				select_line_id = '';
				obj.line.setOptions({strokeColor: gaode.basic_line_color,zIndex:13});
				let start_mark = obj.start_mark;
				let end_mark = obj.end_mark;					
				start_mark.setOptions({zIndex:14});
				end_mark.setOptions({zIndex:15});				
			}
			obj.start_mark.hide();
			obj.end_mark.hide();
			if(mode){
				obj.display = false;		
			}
		}		
		function display_select_line(){ //显示选中路线
			for(let select of select_set){
				let obj = line_map.get(select);				
				obj.start_mark.show();
				obj.end_mark.show();
				obj.line.show();
				obj.display = true;
			}
		}
		async function edit_select_line(road_part_id){
			if(!road_part_id){
				return;
			}
			let line_all_info_obj = line_map.get(road_part_id);
			let route = line_all_info_obj.route;
			if(!line_all_info_obj){
				let filte_map = get_filte_map();
				updata_table(filte_map);		
				return;
			}
			if(draw_line_obj.line){
				await alert_fix('有路线编辑中');
				return;
			}
			let button_mode = document.getElementById('draw_route_button').dataset.mode;
			if(button_mode === 'edit'){
				await alert_fix('有路线编辑中');
				return;
			};
			if(select_line_id){
				let select_line_obj = line_map.get(select_line_id);
				select_line_id = '';
				if(select_line_obj){
					select_line_obj.line.setOptions({strokeColor: gaode.basic_line_color,zIndex:13});
					let start_mark = select_line_obj.start_mark;
					let end_mark = select_line_obj.end_mark;					
					start_mark.setOptions({zIndex:14});
					end_mark.setOptions({zIndex:15});
				}
			}
			clear_mark(['start_mark','end_mark','line','route','distance','path_point'],0);
			draw_line_obj['check_point'].length = 0;
			let input_cell_arr = document.getElementById('road_info_table').querySelectorAll('.input_cell');
			let info_obj = {};
			for(let cell of input_cell_arr){
				let key = cell.id.substring(0, cell.id.length - 6);
				info_obj[key] = line_all_info_obj[key]
			};	
			draw_line_obj['info'] = info_obj;
			for(let [key,value] of line_map){
				value.line.hide();
				value.start_mark.hide();
				value.end_mark.hide();
			};
			let path_point = line_all_info_obj.path_point.slice();
			let check_point = line_all_info_obj.check_point.slice();
			let distance = line_all_info_obj.distance;
			
			let new_line_obj = draw_line_by_path_point(path_point,road_part_id);
			let start_pos = "";
			let end_pos = "";
			if(path_point[0]){
				start_pos = path_point[0].join(',');
			}
			if(path_point[path_point.length-1]&&path_point.length>1){
				end_pos = path_point[path_point.length-1].join(',');
			}
			if(new_line_obj){
				draw_line_obj['start_mark'] = new_line_obj.start_mark;
				draw_line_obj['end_mark'] = new_line_obj.end_mark;
				draw_line_obj['route'] = route;
				draw_line_obj['distance'] = distance;
				draw_line_obj['line'] = new_line_obj.line;
				draw_line_obj['path_point'] = path_point;
				draw_line_obj['check_point'] = check_point;
			}
			map.setFitView(draw_line_obj.line);	
			for(let key in draw_line_obj['info']){
				if(road_data[key]&&road_data[key].input&&road_data[key].input.write){
					let input_value = road_data[key].input.write
					let value = line_all_info_obj[key]
					if(input_value&&value){
						road_data[key].input.write(key,value);
					}
				}
			}
			document.getElementById('edit_div').style.display = 'flex';
			state.is_draw_route = true;
			document.getElementById('draw_route_button').textContent = '结束规划';
			document.getElementById('draw_route_button').dataset.mode = 'edit';
			document.getElementById('hide_select_line_button').style.display = 'none';
			document.getElementById('detail_page_button').style.display = 'none';
			display_road_info(line_all_info_obj);
			get_distance_off();
		}
		function get_filte_map(){ //获取符合条件的路段
			let filte_map = new Map();
			let result = get_filte_info();
			if(result.is_space){
				return line_map;
			}else{
				for(let [key,value] of line_map){
					if(check_filte(value,result)){
						filte_map.set(key,value);
					}else{
						hide_line(value,false);
					};
				}
				return filte_map;
			}
		}
		async function back_draw(){ //撤销操作
			if(state.lock){
				await alert_fix('其他操作进行中，请稍后');
				return;
			}
			state.lock = true;
			draw_line_obj.check_point.pop();
			let road_part_id = draw_line_obj.road_part_id;
			let check_point = draw_line_obj['check_point'].slice();
			let route = await get_route_from_check_point(check_point);
			if(state.is_drag_mode){
				if(draw_line_obj.check_point.length<2){
					let line = draw_line_obj.line;
					if(line){
						map.remove(line);
						line.destroy();
						draw_line_obj.line = null;
					}
					draw_line_obj['path_point'].length = 0;
					let start_pos = draw_line_obj['check_point'][0].join(',');
					let end_pos = "";
					let obj = {
						start_pos:start_pos,
						end_pos:end_pos
					}
					display_road_info(obj);
				}else{
					await create_drag_line_by_check_point(draw_line_obj['check_point']);
				}
			}else{
				draw_line(route,road_part_id);
			}
			if(click_icon){
				map.remove(click_icon);
				click_icon.destroy();
				click_icon = null; 
			}
			state.lock = false;
		}	
		async function input_confirm(){ //编辑界面确定函数
			if(!document.getElementById('road_part_id_input').value||!document.getElementById('road_id_input').value){
				await alert_fix('路线识别码和路段编号不能为空');
				return ;
			}
			let road_part_id = road_data['road_part_id'].input.read('road_part_id')

			if(state.is_draw_route){
				if(document.getElementById('read_road_part_id')){
					let old_road_part_id = document.getElementById('read_road_part_id').textContent
					if(road_part_id !== old_road_part_id){
						if(line_map.has(road_part_id)){
							let isConfirmed  = await confirm_fix('此路段识别码已经存在，是否更新？')
							if(!isConfirmed){
								return;
							}
						}
					}
				}
			}else{
				if(line_map.has(road_part_id)){
					let isConfirmed  = await confirm_fix('此路段识别码已经存在，是否更新？')
					if(!isConfirmed){
						return;
					}
				}
			}
			let input_cell_arr = document.getElementById('road_info_table').querySelectorAll('.input_cell');
			let basic_info = {};
			for(let key in road_data){
				let key_id = key+'_input'
				if(document.getElementById(key_id)){
					if(road_data[key].input&&road_data[key].input.read){					
							basic_info[key] = road_data[key].input.read(key)
					}else{
						basic_info[key] = road_data[key].read_default;
					}
				}else {
					if(road_data[key].input&&road_data[key].input.read){
						
						basic_info[key] = road_data[key].input.read(key);
					}
				}
			};	
			if(basic_info.direction == '上行'&&basic_info.start_pile>basic_info.end_pile){
				await alert_fix('上行(右幅)开始桩号必须小于结束桩号');
				return;
			};
			if(basic_info.direction == '下行'&&basic_info.start_pile<basic_info.end_pile){
				await alert_fix('下行(左幅)开始桩号必须大于结束桩号');
				return;
			};
			modal_work(0);
			let button_mode = document.getElementById('draw_route_button').dataset.mode;
			if(button_mode == 'none'||button_mode =='select'){
				display_road_info();
				clear_mark(['start_mark','end_mark','line','route','distance','path_point'],0);
				draw_line_obj['check_point'].length = 0
				state.is_draw_route = true;
				document.getElementById('edit_div').style.display = 'flex';
				document.getElementById('draw_route_button').textContent = '结束规划';
				document.getElementById('draw_route_button').dataset.mode = 'edit';
				document.getElementById('hide_select_line_button').style.display = 'none';
				document.getElementById('detail_page_button').style.display = 'none';
				get_distance_off();
			};
			basic_info.start_mark = null;
			basic_info.line = null;
			basic_info.end_mark = null;
			display_road_info(basic_info);
			draw_line_obj.info = basic_info;
			for(let [key,value] of line_map){
				hide_line(value,false);
			}
		}
		function downloadTextAsFile(content, fileName) {//文件导出函数
		  const blob = new Blob([content], { type: 'text/plain;charset=utf-8' });
		  const url = URL.createObjectURL(blob);
		  const link = document.createElement('a');
		  link.href = url;
		  link.download = fileName;
		  link.style.display = 'none';
		  document.body.appendChild(link);
		  link.click();
		  document.body.removeChild(link);
		  URL.revokeObjectURL(url); // 释放内存[1,8](@ref)
		}
		function clear_circle_mark() {  // 清除圆形函数
			for(let obj of circle_obj_arr){
				map.remove(obj.area);
				map.remove(obj.center);
				obj.area.destroy();
				obj.center.destroy();
			}
			if(click_icon){
				map.remove(click_icon);		
				click_icon.destroy();
				click_icon = null;      // 释放对象引用			
			}
		}
		function clear_mark(arr,mode){ //清除空编辑路线中的所有元素
			for(let key of arr){
				if(key === 'start_mark'||key === 'end_mark'||key === 'line'){
					if(draw_line_obj[key]){
						map.remove(draw_line_obj[key])
						draw_line_obj[key].destroy();
						draw_line_obj[key] = null;
					}
				}else if(key === 'route'){
					draw_line_obj[key] = null;
				}else if(key == 'distance'){
					draw_line_obj[key] = 0;
				}else if(key === 'check_point'||key === 'path_point'){
					draw_line_obj[key].length = 0;
				}else if(key === 'info'){
					draw_line_obj[key]= {};
				}
				if(mode){
					let obj = {
						start_pos:road_data.start_pos.read_default,
						end_pos:road_data.end_pos.read_default,
						distance:road_data.distance.read_default,
					}
					display_road_info(obj)
				}			
			}
		}			
		function add_click_mark(lng,lat){
			if(click_icon){
				click_icon.setPosition([lng,lat])
			}else{
				click_icon = new AMap.Marker({
					position: [lng, lat], // 圆心位置
					icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png", // 蓝色标记图标
					offset: new AMap.Pixel(-13, -30), // 图标偏移量，使图标底部对准圆心
					zIndex: 20 // 确保标记显示在圆形上方
				});	
				click_icon.setMap(map);
			}
			document.getElementById('gpslng_input').value = "";
			document.getElementById('gpslat_input').value = "";
			document.getElementById('lng_input').value = lng;
			document.getElementById('lat_input').value = lat;
		}
		async function updata_draw_line_obj(lng,lat){
			if(state.lock){
				await alert_fix('其他操作进行中，请稍后');
				return;
			}
			state.lock = true;
			draw_line_obj['check_point'].push([lng,lat]);
			let check_point = draw_line_obj['check_point'];
			let road_part_id = draw_line_obj.road_part_id;
			let route = await get_route_from_check_point(check_point);
			draw_line(route,road_part_id);
			state.lock = false;
		}
		async function get_route_from_check_point(check_point){ //核心代码,利用检查点获得导航数据
			if(check_point.length <2){
				return;
			}
			const drivingOption = {
				policy: AMap.DrivingPolicy.LEAST_DISTANCE,
				ferry: 1,
				province: '浙'
			};
			const driving = new AMap.Driving(drivingOption);
			const arr_max = check_point.length;
			const start_point = new AMap.LngLat(check_point[0][0], check_point[0][1]);
			const end_point = new AMap.LngLat(check_point[arr_max - 1][0], check_point[arr_max - 1][1]);
			const mid_point_arr = [];
			for (let i = 1; i < arr_max - 1; i++) {
				mid_point_arr.push(new AMap.LngLat(check_point[i][0], check_point[i][1]));
			}
			try {
				const result = await new Promise((resolve, reject) => {
					driving.search(
						start_point,
						end_point,
						{ waypoints: mid_point_arr },
						(status, result) => {
							if (status === 'complete') {
								resolve(result);
							} else {
								reject(new Error(`路径规划失败，状态码: ${status}`));
							}
						}
					);
				});
				if (result.routes && result.routes.length) {
					const route = result.routes[0];
					return route;
				}
			} catch (error) {
				console.error('路径绘制异常:'+error.message);
			}
		}
		function get_path_point_by_route(route) { //核心代码，利用导航数据得到路径点
			let path = [];
			for (let i = 0; i < route.steps.length; i++) {
				let step = route.steps[i]
				for (let j = 0; j < step.path.length; j++) {
					if(Array.isArray(step.path[j])){
						path.push(step.path[j]);
					}else{
						let element =  [];
						element.push(step.path[j].lng)
						element.push(step.path[j].lat)
						path.push(element)
					}
				}
			}
			return path;
		}
		function draw_line(route,road_part_id){ //核心代码,根据导航数据获得路径点数据，并调用函数来绘制路线
			clear_mark(['start_mark','end_mark','line','route','distance','path_point'],0);
			let distance = 0;
			if(route){
				let path_point = get_path_point_by_route(route);//利用导航数据得到路径点
				let start_pos = "";
				let end_pos = "";
				if(path_point[0]){
					start_pos = path_point[0].join(',');
				}
				if(path_point[path_point.length-1]&&path_point.length>1){
					end_pos = path_point[path_point.length-1].join(',');
				};
				
				let new_line_obj = draw_line_by_path_point(path_point,road_part_id);//核心代码,利用路径点（二维数组）绘制路线
				if(route.distance){
					distance = Number(route.distance);
				}else{
					distance = Math.round(AMap.GeometryUtil.distanceOfLine(path_point));
				}
				if(new_line_obj){
					draw_line_obj['start_mark'] = new_line_obj.start_mark;
					draw_line_obj['end_mark'] = new_line_obj.end_mark;
					draw_line_obj['line'] = new_line_obj.line;
					draw_line_obj['path_point'] = new_line_obj.path_point;
					draw_line_obj['route'] = route;
					draw_line_obj['distance'] = distance;
				}
				let obj = {
					start_pos:start_pos,
					end_pos:end_pos,
					distance:distance,
				}
				display_road_info(obj);
			}else{
				let check_point = draw_line_obj['check_point'];
				let obj = {}
				if(check_point.length == 1){
					obj['start_pos'] = check_point[0].join(',');
					obj['end_pos'] = road_data['end_pos'].read_default;
				}else if(check_point.length == 0){
					obj['start_pos'] = road_data['start_pos'].read_default;
					obj['end_pos'] = road_data['end_pos'].read_default	;			
				}
				obj['distance'] = distance;
				display_road_info(obj);
			}
		}	
		function draw_line_by_path_point(path,road_part_id){ //核心代码,利用路径点（二维数组）绘制路线
			let path_point = path.slice();
			let startMarker = new AMap.Marker({
				position: path_point[0],
				zIndex:14,
				offset: new AMap.Pixel(-13, -30),
				icon: 'https://webapi.amap.com/theme/v1.3/markers/n/start.png',
				map: map
			})
			let endMarker = new AMap.Marker({
				position: path_point[path_point.length - 1],
				zIndex:15,
				offset: new AMap.Pixel(-13, -30),
				icon: 'https://webapi.amap.com/theme/v1.3/markers/n/end.png',
				map: map
			})
			let routeLine = new AMap.Polyline({
				path: path_point,
				borderWeight: 1,
				strokeWeight: gaode.basic_line_width,
				strokeOpacity: gaode.basic_line_alpha,
				strokeColor: gaode.basic_line_color,
				lineJoin: 'round',
				lineCap:'round',
				cursor:'pointer',
				zIndex:13,
				showDir:true,
				clickable: true
			})
			routeLine.on('click',async function (e){
				let line = e.target
				let line_info = line.getExtData();
				let road_part_id = line_info.road_part_id;
				select_line(road_part_id,0);
				let lng = e.lnglat.getLng()
				let lat = e.lnglat.getLat()
				if(state.is_pile_mode){
					let pos = [lng,lat]
					let obj = line_map.get(road_part_id);
					let path_point = obj.path_point;
					let start = obj.start_pile;
					let end = obj.end_pile;
					if(path_point){
						let pile = get_pile(path_point, pos, start, end)
						let pile_str = get_pile_by_number(pile);
						await creat_auto_destroy_info(pile_str,2500);
					}
				}
			})
			routeLine.setExtData({road_part_id:road_part_id});			
			map.add(routeLine);
			let obj = {
				start_mark:startMarker,
				end_mark:endMarker,
				line:routeLine,
				path_point:path_point
			}
			return obj;
		}
	

		function display_road_info(line_obj){
			if(!line_obj){
				const cell_arr = document.getElementById('road_info').querySelectorAll('.road_info_cell');
				for(let cell of cell_arr){
					cell.textContent = "";
				}
				return;
			}
			for(let key in line_obj){
				let dom_id = 'read_'+key ;
				let dom = document.getElementById(dom_id);
				if(dom){
					if(road_data[key]&&road_data[key].display_str){
						dom.textContent = road_data[key].display_str(key,line_obj);
					}
				}
			}
		}
		function clear_road_info(){
			for(let key in road_data){
				if(road_data[key].input&&road_data[key].input.write){
					road_data[key].input.write(key,road_data[key].read_default)
				}
			}
		}
		function export_geojson(line_obj_arr,coord_type){
			let muluti_obj = {
			  "type": "FeatureCollection",
			  "features": [
			  ]
			};
			for(let line_obj of line_obj_arr){
				let obj = {
				  "type": "Feature",
				  "properties": {
				  },
				  "geometry": {
					"type": "LineString",
				  }
				}
				for(let key in line_obj){
					if(road_data[key]&&road_data[key].export_data&&road_data[key].is_export){
						road_data[key].export_data(key,line_obj[key],obj)
					}				
				}			
				if(coord_type){
					obj.properties['coord_type'] = coord_type;
				}
				muluti_obj.features.push(obj);
			}
			return muluti_obj;
		}		
		function load_line_data(load_obj){
			let line_all_info_obj = {}
			for(let key in road_data){
				line_all_info_obj[key] = road_data[key].load_read(key,load_obj)
			};
			let road_part_id = line_all_info_obj.road_part_id
			let path_point = line_all_info_obj.path_point
			let new_line_obj = draw_line_by_path_point(path_point,road_part_id);
			let start_mark = new_line_obj.start_mark;
			let end_mark = new_line_obj.end_mark;
			let line = new_line_obj.line;
			line_all_info_obj.line = line;
			line_all_info_obj.start_mark = start_mark;
			line_all_info_obj.end_mark = end_mark;
			let old_line_obj = line_map.get(road_part_id)
			
			if(old_line_obj){
				map.remove(old_line_obj.start_mark);
				map.remove(old_line_obj.end_mark);
				map.remove(old_line_obj.line);
				old_line_obj.start_mark.destroy();
				old_line_obj.end_mark.destroy();
				old_line_obj.line.destroy();
				line_map.delete(road_part_id)
			}		
			
			line_map.set(line_all_info_obj.road_part_id,line_all_info_obj)
		}
		function load_data_by_table(content){
			let line_str_arr = content.split('\r\n')
			let data_obj_arr = [];
			let table_head_str = line_str_arr[1];
			let name_map = new Map();
			for(let key in road_data){
				let name = road_data[key].name
				if(name){
					name_map.set(name,key)
				}
			}
			let table_head_key_arr = [];
			if(table_head_str){
				let table_head_arr = table_head_str.split('\t');
				let road_part_id_index = table_head_arr.indexOf('路段识别码');
				if(road_part_id_index<0){
					return data_obj_arr;
				}
				for(let i = 2 ;i<line_str_arr.length;i++){
					let line_info_str = line_str_arr[i]
					if(line_info_str){
						let line_info_arr = line_info_str.split('\t');
						let road_part_id = line_info_arr[road_part_id_index];
						if(road_part_id&&road_part_id!=='暂无'){
							for(let j = 0;j<line_info_arr.length;j++){
								let name = table_head_arr[j];
								let key = name_map.get(name);
								if(key){
									if(road_part_id){
										let line_obj = line_map.get(road_part_id);
										if(line_obj){
											let result = null;
											if(road_data[key].type ==='number'){
												if(line_info_arr[j] === ""){
													result = null;
												}else{
													result = Number(line_info_arr[j]);
												}
											}else if(road_data[key].type ==='string'){
												result = line_info_arr[j];
											}
											line_obj[key] = result;
										}
									}
								}
							}
							data_obj_arr.push(line_str_arr[i]);
						}
					}
				}
			}
			return data_obj_arr;			
		}
		function save_line_to_table(obj){
			let path_point = obj.path_point;
			let road_part_id = obj.road_part_id;
			let new_line_obj = draw_line_by_path_point(path_point,road_part_id)
			let start_mark = new_line_obj.start_mark;
			let end_mark = new_line_obj.end_mark;
			let line = new_line_obj.line;
			let line_all_info_obj = {};
			for(let key in road_data){
				if(obj[key]){
					line_all_info_obj[key] = obj[key]
				}
			}
			line_all_info_obj.start_mark = start_mark;
			line_all_info_obj.end_mark = end_mark;
			line_all_info_obj.line = line;
			let old_line_obj = line_map.get(road_part_id)
			if(old_line_obj){
				map.remove(old_line_obj.start_mark);
				map.remove(old_line_obj.end_mark);
				map.remove(old_line_obj.line);
				old_line_obj.start_mark.destroy();
				old_line_obj.end_mark.destroy();
				old_line_obj.line.destroy();
				line_map.delete(road_part_id);
				if(old_line_obj.display===null ||old_line_obj.display ===undefined){
					line_all_info_obj.display = true;
				}else{
					line_all_info_obj.display = old_line_obj.display;
				}
			};
			line_map.set(road_part_id,line_all_info_obj)
			let filte_map = get_filte_map();
			updata_table(filte_map);
			select_line_change_color(road_part_id);

		};
		function select_line_change_color(road_part_id){
			let line_obj = line_map.get(road_part_id);
			let line = line_obj.line;
			let start_mark = line_obj.start_mark;
			let end_mark = line_obj.end_mark;					
			start_mark.setOptions({zIndex:24});
			end_mark.setOptions({zIndex:25});
			line.setOptions({strokeColor: gaode.select_line_color,zIndex:23});
			if(select_line_id){
				let select_line_obj = line_map.get(select_line_id)
				if(select_line_obj){
					let select_line = select_line_obj.line;
					if(select_line_id !== road_part_id){
						select_line.setOptions({strokeColor: gaode.basic_line_color,zIndex:13});
						let start_mark = select_line_obj.start_mark;
						let end_mark = select_line_obj.end_mark;					
						start_mark.setOptions({zIndex:14});
						end_mark.setOptions({zIndex:15});				
					}
				}
			}
			select_line_id = road_part_id;
			if(!state.is_draw_route){
				document.getElementById('draw_route_button').textContent = '编辑路线';
				document.getElementById('draw_route_button').dataset.mode = 'select';
			}
		}
		function create_all_info_obj(line){
			if(!line){
				return;
			}
			let start_mark = draw_line_obj.start_mark;
			let end_mark = draw_line_obj.end_mark;
			let route = draw_line_obj.route;
			let check_point = draw_line_obj.check_point.slice();
			let path_point = draw_line_obj.path_point.slice();
			let distance = draw_line_obj.distance;
			let start_pos = String(path_point[0])||"";
			let end_pos = String(path_point[path_point.length-1])||"";
			let line_all_info_obj = {
				line:line,
				route:route,
				display:true,
				check_point:check_point,
				start_mark:start_mark,
				end_mark:end_mark,
				path_point:path_point,
				distance:distance,
				start_pos:start_pos,
				end_pos:end_pos
			};//路径数据（会随着路线改变而改变）
			for(let key in draw_line_obj.info){
				line_all_info_obj[key] = draw_line_obj.info[key]
			}
			return line_all_info_obj;
		}	
		function draw_line_clear(){

			if(draw_line_obj.line){
				map.remove(draw_line_obj.line)
				draw_line_obj.line.destroy()
				draw_line_obj.line = null;
			}
			if(draw_line_obj.start_mark){
				map.remove(draw_line_obj.start_mark)
				draw_line_obj.start_mark.destroy()
				draw_line_obj.start_mark = null;
			}
			if(draw_line_obj.end_mark){
				map.remove(draw_line_obj.end_mark)
				draw_line_obj.end_mark.destroy()
				draw_line_obj.end_mark = null;
			}
				draw_line_obj.route = null
				draw_line_obj.distance = 0
				draw_line_obj.check_point.length = 0
				draw_line_obj.path_point.length = 0
				draw_line_obj.info = {}
		}		
		async function close_edit_menu(){
			let line = draw_line_obj.line;
			let road_part_id = draw_line_obj.info.road_part_id;
			let is_change = false;
			if(line){
				let line_all_info_obj = create_all_info_obj(line);
				let line_obj = line_map.get(line_all_info_obj.road_part_id);
				if(line_obj){
					let isConfirmed = await confirm_fix("是否更新路径信息?");
					if(isConfirmed){
						save_line_to_table(line_all_info_obj);
						is_change = true;
					}else{								
						is_change = false;
					}
				}else{
					let isConfirmed = await confirm_fix("是否保存?");
					if(isConfirmed){
						save_line_to_table(line_all_info_obj);
						is_change = true;
					}else{									
						is_change = false;
					}
				};
				for(let [key,value] of line_map){
					if(value.display){
						value.line.show();
						value.start_mark.show();
						value.end_mark.show();
					}				
				}					
				draw_line_clear();
				if(is_change){
					document.getElementById('draw_route_button').textContent ='编辑路线';
					document.getElementById('draw_route_button').dataset.mode = 'select';				
				}else{
					document.getElementById('draw_route_button').textContent ='新增路线';
					document.getElementById('draw_route_button').dataset.mode = 'none';
					display_road_info();
				}
			}else{
				document.getElementById('draw_route_button').textContent ='新增路线';
				document.getElementById('draw_route_button').dataset.mode = 'none';
				display_road_info();
			};
			clear_mark(['start_mark','end_mark','line','route','distance','path_point','check_point','info'],0)
			draw_route_off();
			document.getElementById('edit_div').style.display = 'none';
			document.getElementById('hide_select_line_button').style.display = 'block';
			document.getElementById('detail_page_button').style.display = 'block';
			clear_input_cell();
		}
		function check_filte(value,filte_result){ //筛选逻辑
			let filte_input_obj = filte_result.filte_input_obj
			let filte_checkbox_obj = filte_result.filte_checkbox_obj
			for(let key in filte_input_obj){
				if(filte_input_obj[key]!==""&&filte_input_obj[key]!== undefined &&road_data[key].filte&&road_data[key].filte.check){
					let result = road_data[key].filte.check(key,value,filte_input_obj[key]);
					if(!result){
						return false;
					}
				}
			}
			for(let key in filte_checkbox_obj){
				if(filte_checkbox_obj[key]!==""&&filte_checkbox_obj[key]!== undefined&&road_data[key].filte&&road_data[key].filte.check){
					let result = road_data[key].filte.check(key,value,filte_checkbox_obj[key])
					if(!result){
						return false;
					}
				}
			}
			return true;
		}
		//导出地图
		function get_map_area(){
			if(!mouseTool){
				return;
			}
			mouseTool.on('draw',map_out)
			creat_alert_info('请绘制导出地图范围');
			mouseTool.rectangle({
				strokeColor:'blue',
				strokeOpacity:0.5,
				strokeWeight: 2,
				fillColor:'blue',
				fillOpacity:0,
				strokeStyle: 'solid',
			})
		}
		async function map_out(event) {
			mouseTool.off('draw',map_out)
			let pic = event.obj;
			const vertexes = pic.getPath();
			let x_arr = []
			let y_arr = []
			for(let point of vertexes){
				x_arr.push(point.lng)
				y_arr.push(point.lat)
			}
			x_arr.sort()
			y_arr.sort()
			let x_min = x_arr[0]
			let x_max = x_arr[x_arr.length-1]
			let y_min = y_arr[0]
			let y_max = y_arr[y_arr.length-1]		
			
			document.getElementById('get_map_x_min_input').value = x_min
			document.getElementById('get_map_x_max_input').value = x_max
			document.getElementById('get_map_y_min_input').value = y_min 
			document.getElementById('get_map_y_max_input').value = y_max
			let isConfirmed = await confirm_fix('是否确定');
			delete_alert_info();		
			map.remove(pic);
			pic.destroy();
			mouseTool.close();
			if(!isConfirmed){
				return;
			}
			await get_map_by_lng_lat(x_min,x_max,y_min,y_max)
		}
		async function get_map_by_lng_lat(x_min,x_max,y_min,y_max){
			let zoom_scale = Number(document.getElementById('get_map_zoom_scale_input').value);
			if(!zoom_scale){
				await alert_fix('参数不能小于3或者大于18');
				return;
			}
			if(zoom_scale<3||zoom_scale>18){
				await alert_fix('参数不能小于3或者大于18')
				return;
			}
			let wait_time = Number(document.getElementById('get_map_wait_time_input').value);
			if(!wait_time){
				wait_time = 2000;
			}
			if(wait_time<0){
				await alert_fix('等待时间必须大于0毫秒')
				return;
			}
			let line_width = Number(document.getElementById('get_map_line_width_input').value);
			if(!line_width){
				line_width = gaode.basic_line_width;
			}
			if(line_width<0){
				await alert_fix('路线宽度大于0')
				return;
			}
			let line_alpha  = Number(document.getElementById('get_map_line_alpha_input').value);
			map.setZoom(zoom_scale,true)
			await delay(1000)
			let mark_mode = document.getElementById('get_map_mark_mode_input').value;
			let mark_distance = Number(document.getElementById('get_map_mark_distance_input').value)||5000;
			let mark_scale = Number(document.getElementById('get_map_mark_scale_input').value)||1;
			let mark_back_value = document.getElementById('get_map_mark_back_input').value;
			let mark_back = 'rgba(255, 255, 255,0.8)'
			if(mark_back_value){
				mark_back = 'rgba('+document.getElementById('get_map_mark_back_input').value+')'
			}
			let mark_color = document.getElementById('get_map_mark_color_input').value||'#000000';
			let mark_str_distance = Number(document.getElementById('get_map_mark_str_distance_input').value) ||500;
			let back_line_width = Number(document.getElementById('get_map_mark_line_input').value);
			let mark_key = document.getElementById('get_map_mark_key_input').value
			let mark_limit = Number(document.getElementById('get_map_mark_limit_input').value)||0;
			await get_map(mark_limit,mark_key,wait_time,x_min,x_max,y_min,y_max,zoom_scale,line_width,line_alpha,mark_mode,mark_distance,mark_str_distance,mark_scale,mark_back,mark_color,back_line_width);
		}
		function delay(ms) {
		  return new Promise(resolve => setTimeout(resolve, ms));
		}
		function get_pixel_data_by_gps(arr,zoom_scale){
			let pixel = map.lngLatToPixel(arr, zoom_scale);
			return[pixel.x,pixel.y]
		}
		function wait_move_end() {
		  return new Promise((resolve) => {
			const handler = () => {
			  resolve();
			  map.off('moveend', handler); // 移除监听
			};
			map.on('moveend', handler); // 添加监听
		  });
		}
		function move_by_pixel(x,y){
		  return new Promise((resolve) => {
			map.panBy(x, y);
			resolve()
		  });
		}
		async function get_map(mark_limit,mark_key,wait_time,x_min,x_max,y_min,y_max,zoom_scale,line_width,line_alpha,mark_mode,mark_distance,mark_str_distance,mark_scale,mark_back,mark_color,back_line_width){
			let color_input = document.getElementById('get_map_color_menu_div').querySelectorAll('.get_map_menu_input_cell');
			let key = document.getElementById('get_map_color_select').value;
			let op_color_map = new Map();
			for(let input of color_input){
				let color  = input.value;
				if(!color){
					color = gaode.basic_line_color
				}
				let road_lv = input.dataset.value
				op_color_map.set(road_lv,color)
			}
			for(let [road_part_id,line_obj] of line_map){
				if(line_obj.line){
					line_obj.line.setOptions({strokeWeight:line_width,strokeOpacity:line_alpha});
					if(key){
						let op = line_obj[key]
						let line_color = op_color_map.get(op)
						if(line_color){
							line_obj.line.setOptions({strokeColor:line_color});
						}
					}
				}
			}		
			let canvas = document.querySelector('.amap-layer');	
			let mapSize = map.getSize();//获取地图大小，返回的是地图容器的像素大小
			let canvas_width = mapSize.width;
			let canvas_height = mapSize.height;			
			map.setCenter([x_min,y_max],true)
			await Promise.all([wait_move_end(), move_by_pixel(-canvas_width/2,-canvas_height/2)]);
			await delay(wait_time);
			let all_road_mark_arr = [];
			if(mark_mode == '模式一'){
				for(let [road_part_id,line_obj] of line_map){
					if(line_obj.display&&table_line_set.has(road_part_id)){
						let arr = get_text_mark_pos_mode1(mark_limit,road_part_id,mark_key,mark_distance,canvas_width,canvas_height,mark_str_distance)
						if(arr){
							all_road_mark_arr.push(arr)
						}
					}
				}
			}
			if(mark_mode == '模式二'){
				for(let [road_part_id,line_obj] of line_map){
					if(line_obj.display&&table_line_set.has(road_part_id)){
						let arr = get_text_mark_pos_mode2(mark_limit,road_part_id,mark_key,mark_distance,canvas_width,canvas_height,mark_str_distance)	
						if(arr){
							all_road_mark_arr.push(arr)
						}
					}
				}
			}
			let right_up_pos = get_pixel_data_by_gps([x_max,y_max],zoom_scale)
			let left_up_pos = get_pixel_data_by_gps([x_min,y_max],zoom_scale)
			let left_down_pos = get_pixel_data_by_gps([x_min,y_min],zoom_scale)
			let right_down_pos = get_pixel_data_by_gps([x_max,y_min],zoom_scale)
			let y_distance =  Math.abs(right_up_pos[1]-right_down_pos[1])
			let x_distance =  Math.abs(right_down_pos[0]-left_down_pos[0])
			
			let x_count = Math.floor(x_distance/canvas_width)
			let y_count = Math.floor(y_distance/canvas_height)
			let base_pos = left_up_pos.slice();
			let x_base = base_pos[0];
			let y_base = base_pos[1];
			
			let big_picture_arr = [];
			for(let j = 0;j<=y_count;j++){
				y_move_distance = canvas_height+canvas_height*(j)
				let y_cut = canvas_height;
				if(y_move_distance>y_distance){
					y_cut = canvas_height-(y_move_distance-y_distance)
				}
				let picture_arr = []
				let x_cut = canvas_width;
				let x_move_distance = canvas_width;
				if(x_move_distance>x_distance){
					x_cut = canvas_width-(x_move_distance-x_distance)
				}
				let blob = await get_picture()
				if(x_cut !== canvas_width||y_cut !== canvas_height){
					blob = await cut_picture(blob, x_cut, y_cut)
				}
				picture_arr.push(blob);
				for(let i = 0;i<x_count;i++){
					let fun1 = wait_move_end()
					let fun2 = move_by_pixel(-canvas_width,0)
					await Promise.all([fun1, fun2]);
					await delay(wait_time);
					x_move_distance = x_move_distance+canvas_width
					let x_cut = canvas_width;
					if(x_move_distance>x_distance){
						x_cut = canvas_width-(x_move_distance-x_distance)
					}
					if(x_cut !== canvas_width||y_cut!== canvas_height){
						let blob = await get_picture()
						let new_blob = await cut_picture(blob,x_cut, y_cut)
						picture_arr.push(new_blob);
					}else{
						let blob = await get_picture()
						picture_arr.push(blob);
					}
				}
				big_picture_arr.push(picture_arr);
				if(j<y_count){			
					let fun1 = wait_move_end()
					let fun2 = move_by_pixel(x_move_distance-canvas_width,-canvas_height)
					await Promise.all([fun1, fun2]);
					await delay(wait_time);
				}
			}
			let canvas_obj = await combine_img(big_picture_arr);
			for(let arr of all_road_mark_arr){
				if(canvas_obj){
					let ctx = canvas_obj.ctx;
					for(let element of arr ){
						draw_text_icon(ctx,element,mark_scale,mark_back,mark_color,back_line_width)
					}
				}
			}
			let big_picture_canvas = canvas_obj.canvas
			let big_picture_blob = await get_blob_from_canvas(big_picture_canvas);
			for(let [key,value] of line_map){
				if(value.line){
					value.line.setOptions({strokeWeight:gaode.basic_line_width,strokeOpacity:gaode.basic_line_alpha,strokeColor:gaode.basic_line_color});
				}
			}
			let link = document.createElement('a');
			link.href = URL.createObjectURL(big_picture_blob);
			link.download = '地图导出.png';
			link.click();		
		}
		function downloadMapImage() { //导出地图为图片
			let canvas = document.querySelector('.amap-layer');
			canvas.toBlob(
				blob => {
				  const link = document.createElement('a');
				  link.href = URL.createObjectURL(blob);
				  link.download = '高德地图截图.png';
				  link.click();
				},
				"image/jpeg", // 设置文件格式
				1 // 设置文件质量
			);
		}
		// 修改后的图片捕获函数
		async function cut_picture(blob, x, y) {
			return new Promise((resolve, reject) => {
				// 创建Image对象加载原始图片
				const img = new Image();
				img.onload = () => {
					// 创建Canvas元素
					const canvas = document.createElement('canvas');
					const ctx = canvas.getContext('2d');
					canvas.width = x;
					canvas.height = y;
					ctx.drawImage(img,0,0);
					// 将Canvas转为Blob
				  canvas.toBlob(blob => {
					canvas.remove();
					if (!blob) {
					  reject(new Error('Failed to generate blob from canvas'));
					  return;
					}
					resolve(blob);
					
				  }, "image/png", 1);
				};
				img.onerror = () => reject(new Error('图片加载失败'));
				img.src = URL.createObjectURL(blob);
			});
		}	
		function get_picture() {
		  return new Promise((resolve, reject) => {
			try {
			  const canvas = document.querySelector('.amap-layer');
			  if (!canvas) {
				throw new Error('canvas element not found');
			  }
			  canvas.toBlob(blob => {
				if (!blob) {
				  reject(new Error('Failed to generate blob from canvas'));
				  return;
				}
				resolve(blob);
			  }, "image/png", 1);
			} catch (error) {
			  reject(error);
			}
		  });
		}
		async function combine_img(picture_arr) {
		  if (picture_arr.length === 0) {
			return;
		  }
		  let urls = [];
			// 加载图片函数
			function load_image(blob){
				return new Promise((resolve, reject) => {
					const url = URL.createObjectURL(blob);
					urls.push(url);
					const img = new Image();
					img.onload = () => resolve(img);
					img.onerror = reject;
					img.src = url;
				})
			};
			// 加载所有图片到二维数组
			const image_grid_arr = [];
			for (let row_arr of picture_arr) {
				let load_row_img_arr = [];
				for(let img of row_arr){
					load_row_img_arr.push(load_image(img))
				}
				let loaded_row = await Promise.all(load_row_img_arr);
				image_grid_arr.push(loaded_row);
			}
			let firt_img_arr = image_grid_arr[0];
			if(!firt_img_arr){
				return;
			};
			let first_row_width = 0;
			for(let img of firt_img_arr){
				first_row_width = first_row_width+img.width;
			}
			let total_height = 0
			for(let img_arr of image_grid_arr){
				total_height = total_height+img_arr[0].height
			}
			// 创建画布
			let canvas = document.createElement('canvas');
			let ctx = canvas.getContext('2d');
			canvas.width = first_row_width;
			canvas.height = total_height;
			// 绘制图片
			let current_y = 0;
			for (let i = 0; i < image_grid_arr.length; i++) {
			  let row_arr = image_grid_arr[i];
			  let row_height = image_grid_arr[i][0].height;
			  // 水平绘制该行图片
			  let current_x = 0;
			  for (let img of row_arr) {
				ctx.drawImage(img, current_x, current_y, img.width, row_height);
				current_x = current_x+img.width;
			  }
			  current_y = current_y+row_height;
			}
			for(let url of urls){
				URL.revokeObjectURL(url)
			}
			for(let img_arr of image_grid_arr){
				for(let img of img_arr){
					img.src = "";
					img.remove();
					img = null;
				}
			}
			return {ctx:ctx,canvas:canvas};
		}
		function get_blob_from_canvas(canvas){
			return new Promise((resolve, reject) => {
			  canvas.toBlob(blob => {
				  resolve(blob);
				  canvas.remove();
			  }, 'image/png');
			});
		}

	//自动标记模块
		function get_polyline_length(path_arr) {
			let total_length = 0;
			for (let i = 1; i < path_arr.length; i++) {
				total_length = total_length + AMap.GeometryUtil.distance(path_arr[i-1],path_arr[i])
			}
			return total_length;
		}
		function get_point_and_segment_at_distance(path, distance) {
			let accumulated_distance = 0;
			for (let i = 1; i < path.length; i++) {
				let segment_distance = AMap.GeometryUtil.distance(path[i-1], path[i]);// 如果累计距离加上当前线段距离超过目标距离
				if (accumulated_distance + segment_distance >= distance) {
					let ratio = (distance - accumulated_distance) / segment_distance;
					if(!segment_distance){
						return null;
					}
					let lng = path[i-1][0] + (path[i][0] - path[i-1][0]) * ratio;
					let lat = path[i-1][1] + (path[i][1] - path[i-1][1]) * ratio;
					return {
						point: [lng, lat],
						segment_index: i-1
					};
				}
				accumulated_distance =accumulated_distance+segment_distance;
			}
			return {
				point: path[path.length-1],
				segment_index: path.length-2
			};
		}
		// 计算线段角度（考虑方向）
		function get_angle(point1, point2) {
			// 将经纬度坐标转换为容器像素坐标
			let pixel1 = map.lngLatToContainer(new AMap.LngLat(point1[0], point1[1]));
			let pixel2 = map.lngLatToContainer(new AMap.LngLat(point2[0], point2[1]));
			
			// 计算两点之间的向量
			let dx = pixel2.x - pixel1.x;
			let dy = pixel2.y - pixel1.y;
			return (Math.atan2(dy, dx) * 180 / Math.PI);
		}
		function get_angle_for_mode1(point1, point2) {
			// 将经纬度坐标转换为容器像素坐标
			let pixel1 = map.lngLatToContainer(new AMap.LngLat(point1[0], point1[1]));
			let pixel2 = map.lngLatToContainer(new AMap.LngLat(point2[0], point2[1]));
			
			// 计算两点之间的向量
			if(pixel2.x - pixel1.x<0){
				let dx = pixel1.x - pixel2.x;
				let dy = pixel1.y - pixel2.y;
				let angle = Math.atan2(dy, dx) * 180 / Math.PI;	
				return angle;
			}else{
				let dx = pixel2.x - pixel1.x;
				let dy = pixel2.y - pixel1.y;
				angle = Math.atan2(dy, dx) * 180 / Math.PI;	
				return angle;
			}
			return angle;
		}
		// 沿折线添加文字标注
		function get_text_mark_pos_mode1(mark_limit,road_part_id,mark_key,restart_interval,canvas_width,canvas_height,text_interval) {
			let line_obj = line_map.get(road_part_id);
			if(!line_obj){
				return;
			}
			let path_arr = line_obj.path_point;
			let str = line_obj[mark_key];
			if(str === ""||str === undefined ||str === null){
				return;
			}		
			let arr = []
			let total_length = get_polyline_length(path_arr);
			if(total_length<mark_limit){
				return;
			}
			let restart_count = 0;
			let mark_count = 0;
			
			for (let current_distance = text_interval*str.length;current_distance <= total_length-(text_interval*str.length); current_distance = current_distance+restart_interval) {	
				let result = get_point_and_segment_at_distance(path_arr, current_distance);
				if(result){
					let position = result.point;
					let segment_index = result.segment_index;
					let start_point = path_arr[segment_index];
					let end_point = path_arr[segment_index + 1];
					let angle = get_angle_for_mode1(start_point, end_point);
					let pos = map.lngLatToContainer(new AMap.LngLat(position[0],position[1]));
					let x = pos.x;
					let y = pos.y;
					arr.push({
						str:str,
						x:pos.x,
						y:pos.y,
						angle:angle,
						road_part_id:line_obj.road_part_id
					})
					mark_count++
				}
			}
			if(mark_count===0&&total_length>text_interval*str.length){
				let current_distance = total_length/2
				let result = get_point_and_segment_at_distance(path_arr, current_distance);
				if(result){
					let position = result.point;
					let segment_index = result.segment_index;
					let start_point = path_arr[segment_index];
					let end_point = path_arr[segment_index + 1];
					let angle = get_angle_for_mode1(start_point, end_point);
					let pos = map.lngLatToContainer(new AMap.LngLat(position[0],position[1]));
					let x = pos.x;
					let y = pos.y;
					arr.push({
						str:str,
						x:pos.x,
						y:pos.y,
						angle:angle,
						road_part_id:line_obj.road_part_id
					})
				}
			}
			return arr;
		}
		function get_text_mark_pos_mode2(mark_limit,road_part_id,mark_key,restart_interval,canvas_width,canvas_height,text_interval) {
			let line_obj = line_map.get(road_part_id);
			let arr = []
			if(!line_obj){
				return arr;
			}
			let text_to_show = line_obj[mark_key];
			if(text_to_show === ""||text_to_show === undefined ||text_to_show === null){
				return arr;
			}
			let path_arr = line_obj.path_point;
			let total_length = get_polyline_length(path_arr);
			if(total_length<mark_limit){
				return;
			}
			let str_index = 0;
			let in_restart_interval = false;// 是否处于重复间隔期
			let restart_count = 0;
			for (let current_distance = text_interval; current_distance <= total_length-text_interval; current_distance = current_distance+text_interval) {
				if (!in_restart_interval && str_index === 0) {// 检查剩余距离是否足够显示完整文本
					let remaining_distance = total_length - current_distance;
					let required_distance = (text_to_show.length) * text_interval;
					if (remaining_distance < required_distance) {
						break;
					}
				}
				if(!in_restart_interval) {
					let str = text_to_show[str_index % text_to_show.length];// 获取当前要显示的字符（循环使用文本中的字符）
					let result = get_point_and_segment_at_distance(path_arr, current_distance);
					let position = result.point;
					let segment_index = result.segment_index;
					let start_point = path_arr[segment_index];
					let end_point = path_arr[segment_index + 1];
					let angle = get_angle(start_point, end_point);
					let pos = map.lngLatToContainer(new AMap.LngLat(position[0],position[1]));
					let x = pos.x;
					let y = pos.y;
					arr.push({
						str:str,
						x:pos.x,
						y:pos.y,
						angle:angle,
						road_part_id:line_obj.road_part_id
					})
					str_index++;
					if (str_index >= text_to_show.length) {
						in_restart_interval = true;
						restart_count = 0;
					}
				} else {
					restart_count = restart_count+text_interval;
					if(restart_count >= restart_interval) {
						in_restart_interval = false;
						str_index = 0;
					}
				}
			}
			if(arr.length === 0&&total_length>text_interval*(text_to_show.length)){
				let cell_distance = total_length/(text_to_show.length+1)
				for(let i = 1;i<=text_to_show.length;i++){
					let str = text_to_show[i-1];
					let result = get_point_and_segment_at_distance(path_arr, cell_distance*i);
					let position = result.point;
					let segment_index = result.segment_index;
					let start_point = path_arr[segment_index];
					let end_point = path_arr[segment_index + 1];
					let angle = get_angle(start_point, end_point);
					let pos = map.lngLatToContainer(new AMap.LngLat(position[0],position[1]));
					let x = pos.x;
					let y = pos.y;
					arr.push({
						str:str,
						x:pos.x,
						y:pos.y,
						angle:angle,
						road_part_id:line_obj.road_part_id
					})
				}
			}
			return arr;
		}
		function draw_text_icon(ctx, annotation, scale, mark_back, mark_color, line_width) {
			const { str, x, y, angle } = annotation;
			ctx.save();
			
			// 移动到中心点并旋转
			ctx.translate(x, y);
			ctx.rotate(angle * Math.PI / 180);
			ctx.scale(scale, scale);
			
			// 设置文字样式
			ctx.font = "bold 24px 'Segoe UI', sans-serif";
			ctx.textAlign = "center";
			ctx.textBaseline = "middle";
			ctx.fillStyle = mark_color;
			
			const textWidth = ctx.measureText(str).width;
			const padding = 5;
			const boxWidth = textWidth + padding * 2;
			const boxHeight = 40;
		   
			ctx.fillStyle = mark_back;
			// 只有在 line_width > 0 时才设置边框样式
			if (line_width && line_width > 0) {
				ctx.strokeStyle = mark_color;
				ctx.lineWidth = line_width;
			}
			// 绘制圆角矩形
			ctx.beginPath();
			ctx.roundRect(-boxWidth / 2, -boxHeight / 2, boxWidth, boxHeight, 4);
			ctx.fill(); // 填充背景
			
			// 仅当 line_width > 0 时才绘制边框
			if (line_width && line_width > 0) {
				ctx.stroke();
			}
			// 绘制文字
			ctx.fillStyle = mark_color;
			ctx.fillText(str, 0, 0);
			ctx.restore();
		}
		//
    </script>
	<script>
		// 检查参数是否存在
		function check_local_storage(){
			const key = localStorage.getItem('amap_key');
			const safe_key = localStorage.getItem('amap_safe_key');
			const adcode = localStorage.getItem('adcode');
			const adcode_lng = localStorage.getItem('adcode_lng');
			const adcode_lat = localStorage.getItem('adcode_lat');
			let basic_info_obj =  {
				api_key:key,
				safe_key:safe_key,
				adcode:adcode,
				adcode_lng:adcode_lng,
				adcode_lat:adcode_lat,
			};
			return basic_info_obj
		}	
		async function save_key_and_adcode(){
			let key = document.getElementById('aip_key_input').value.trim();
			let safeKey = document.getElementById('aip_safe_key_input').value.trim();
			let adcode = document.getElementById('adcode_input').value.trim();
			let adcode_lng = Number(document.getElementById('adcode_lng_input').value.trim());
			let adcode_lat = Number(document.getElementById('adcode_lat_input').value.trim());
			if(!adcode_lng){
				adcode_lng = 116.397428
			}
			if(!adcode_lat){
				adcode_lat = 39.90923
			}			
			localStorage.setItem('amap_key', key);
			localStorage.setItem('amap_safe_key', safeKey);
			localStorage.setItem('adcode', adcode);
			localStorage.setItem('adcode_lng', adcode_lng);
			localStorage.setItem('adcode_lat', adcode_lat);
			close_key_save_win();
			await alert_fix('参数已保存！请刷新页面或重启应用！');
		}
		let {check_filte_arr,table_key_arr} = create_page();//根据参数生成页面
		let basic_info = check_local_storage();
		let api_key = basic_info.api_key
		let safe_key = basic_info.safe_key
		let adcode = basic_info.adcode
		let adcode_lng = basic_info.adcode_lng
		let adcode_lat = basic_info.adcode_lat
		if(!api_key||!safe_key||!adcode){
			open_key_save_win();
		}else{
			window._AMapSecurityConfig = {
				securityJsCode: safe_key,
			}
			let script = document.createElement('script');
			document.body.appendChild(script);
			script.onload = async ()=>{
				await start(adcode,adcode_lng,adcode_lat)
			}	
			script.src = 'https://webapi.amap.com/maps?v=2.0&key='+api_key	
		}
	</script>
</body>
</html>